Formulário Modal

Rodrigo Vieira E da Silva · Março 28, 2017

Olá a todos do forum, tudo bem?

To com uma dúvida que vocês aqui podem me ajudar.
Eu criei um formulário para atualizar os dados de um sistema que fiz, porém este formulário foi feito em um modal em javascript muito simples.

Minha dúvida é o seguinte eu tenho um botão editar e quando eu clico nele eu quero que ele abra o modal referente ao registro que estou solicitando, ou seja como abrir o modal com o parâmetro da ID?

Pita · Março 28, 2017

mas existem vários modais ou um unico modal e você atribui os valores nele?

Rodrigo Vieira E da Silva · Março 28, 2017

Esse aqui é meu modal

<div class="windowe" id="janela">
    <a href="#" class="fechar" title="Fechar">&#10006;</a>
    <form id="frmeditar" action="" method="post" class="frms">
        <div id="elastico">
	        <h1>Atualizar dados</h1>
	        <div class="cols">
	            <p>
	            	<input type="hidden" name="id" value="<?=$id;?>">
	                <label>Categoria</label>
	                <select name="categoria" id="categoria" class="categoria">
	                    <option value="<?=$categoria;?>"><?php nomecategoria();?></option>
	                    <option value="0">Selecione</option>
						<option value="4">Clientes ativo</option>
						<option value="2">Contatos</option>
						<option value="1">Fornecedores</option>
						<option value="3">Construtoras e Incorporadoras</option>
	                </select>

	                <label>Segmento</label>
	                <input type="text" name="seguimento" id="seguimento" value="<?=$seguimento;?>" />

	                <label>Empresa</label>
	                <input type="text" name="empresa" id="txtempresa" value="<?=$empresa;?>" />
	            </p>

	            <p>
	                <label>Endereço</label>
	                <textarea name="cadastro_endereco" id="txtendereco"><?=$endereco;?></textarea>
	            </p>
	            <p>
	                <label>Dados da Empresa</label>
	                <textarea name="dados_empresa" id="dateEmpresa"><?=$dempresa;?></textarea>
	            </p>
	        </div>
	        <div class="members">
	            <div class="titles">
	                <label id="tlnome">Nome</label>
	                <label id="tlemail">E-mail</label>
	                <label id="tltelefone">Telefone</label>
	                <label id="tlcelular">Celular</label>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato"   id="contato"  class="cnomes"      value="<?=$contato;?>" />
	                <input type="email" name="cadastro_email1"   id="email"    class="cemails"     value="<?=$email1;?>" />
	                <input type="text" name="cadastro_telefone1" id="telefone" class="ctelefones"  value="<?=$telefone1;?>" />
	                <input type="text" name="cadastro_celular1"  id="celular"  class="ccelulares"  value="<?=$celular1;?>" />
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato2"  id="cadastro_contato2"  class="cnomes"      value="<?=$contato2;?>"/>
	                <input type="email" name="cadastro_email2"   id="cadastro_email2"    class="cemails"     value="<?=$email2;?>"/>
	                <input type="text" name="cadastro_telefone2" id="cadastro_telefone2" class="ctelefones"  value="<?=$telefone2;?>"/>
	                <input type="text" name="cadastro_celular2"  id="cadastro_celular2"  class="ccelulares"  value="<?=$celular2;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato3"  id="cadastro_contato3"  class="cnomes"      value="<?=$contato3;?>"/>
	                <input type="email" name="cadastro_email3"   id="cadastro_email3"    class="cemails"     value="<?=$email3;?>"/>
	                <input type="text" name="cadastro_telefone3" id="cadastro_telefone3" class="ctelefones"  value="<?=$telefone3;?>"/>
	                <input type="text" name="cadastro_celular3"  id="cadastro_celular3"  class="ccelulares"  value="<?=$celular3;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato4"  id="cadastro_contato4"  class="cnomes"      value="<?=$contato4;?>"/>
	                <input type="email" name="cadastro_email4"   id="cadastro_email14"   class="cemails"     value="<?=$email4;?>"/>
	                <input type="text" name="cadastro_telefone4" id="cadastro_telefone4" class="ctelefones"  value="<?=$telefone4;?>"/>
	                <input type="text" name="cadastro_celular4"  id="cadastro_celular4"  class="ccelulares"  value="<?=$celular4;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato5"  id="cadastro_contato5"  class="cnomes"      value="<?=$contato5;?>"/>
	                <input type="email" name="cadastro_email5"   id="cadastro_email15"   class="cemails"     value="<?=$email5;?>"/>
	                <input type="text" name="cadastro_telefone5" id="cadastro_telefone5" class="ctelefones"  value="<?=$telefone5;?>"/>
	                <input type="text" name="cadastro_celular5"  id="cadastro_celular5"  class="ccelulares"  value="<?=$celular5;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato6"  id="cadastro_contato6"  class="cnomes"      value="<?=$contato6;?>"/>
	                <input type="email" name="cadastro_email6"   id="cadastro_email16"   class="cemails"     value="<?=$email6;?>"/>
	                <input type="text" name="cadastro_telefone6" id="cadastro_telefone6" class="ctelefones"  value="<?=$telefone6;?>"/>
	                <input type="text" name="cadastro_celular6"  id="cadastro_celular6"  class="ccelulares"  value="<?=$celular6;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato7"  id="cadastro_contato7"  class="cnomes"      value="<?=$contato7;?>"/>
	                <input type="email" name="cadastro_email7"   id="cadastro_email17"   class="cemails"     value="<?=$email7;?>"/>
	                <input type="text" name="cadastro_telefone7" id="cadastro_telefone7" class="ctelefones"  value="<?=$telefone7;?>"/>
	                <input type="text" name="cadastro_celular7"  id="cadastro_celular7"  class="ccelulares"  value="<?=$celular7;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato8"  id="cadastro_contato8"  class="cnomes"      value="<?=$contato8;?>"/>
	                <input type="email" name="cadastro_email8"   id="cadastro_email18"   class="cemails"     value="<?=$email8;?>"/>
	                <input type="text" name="cadastro_telefone8" id="cadastro_telefone8" class="ctelefones"  value="<?=$telefone8;?>"/>
	                <input type="text" name="cadastro_celular8"  id="cadastro_celular8"  class="ccelulares"  value="<?=$celular8;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato9"  id="cadastro_contato9"  class="cnomes"      value="<?=$contato9;?>"/>
	                <input type="email" name="cadastro_email9"   id="cadastro_email19"   class="cemails"     value="<?=$email9;?>"/>
	                <input type="text" name="cadastro_telefone9" id="cadastro_telefone9" class="ctelefones"  value="<?=$telefone9;?>"/>
	                <input type="text" name="cadastro_celular9"  id="cadastro_celular9"  class="ccelulares"  value="<?=$celular9;?>"/>
	            </div>

	            <div class="titles">
	                <input type="text" name="cadastro_contato10"  id="cadastro_contato10"     class="cnomes"      value="<?=$contato10?>"/>
	                <input type="email" name="cadastro_email10"   id="cadastro_email10"       class="cemails"     value="<?=$email10?>"/>
	                <input type="text" name="cadastro_telefone10" id="cadastro_telefone10"    class="ctelefones"  value="<?=$telefone10?>"/>
	                <input type="text" name="cadastro_celular10"  id="cadastro_celular10"     class="ccelulares"  value="<?=$celular10?>"/>
	            </div>

	            <input type="button" value="salvar" title="Salvar" id="btnsalvar" />
	        </div>
		</div>
    </form>
</div>

Esse aqui é o Link do meu botão que tem que abrir o modal

Aqui está o JavaScript para o modal aparecer:

$("a[rel=modal]").click(function(ev) {
	ev.preventDefault();

	var id = $(this).attr("href");
	var alturaTela = $(document).height();
	var larguraTela = $(window).width();

	$('.mascarae').css({'width': larguraTela, 'height': alturaTela});
	$('.mascarae').fadeIn(1000);
	$('.mascarae').fadeTo("slow", 0.8);

	var left = ($(window).width() / 2) - ($(id).width() / 2);
	var top = ($(window).height() / 2) - ($(id).height() / 2);

	$(id).css({'top': top, 'left': left});
	$(id).show();
});

$(".mascarae").click(function() {
	$(this).hide();
	$(".windowe").hide();
});

$('.fechar').click(function(ev) {
	ev.preventDefault();
	$(".mascarae").hide();
	$(".windowe").hide();
});