Load client data in a PHP modal

1

Hello,

I'm having a problem developing a page that reports a list of clients. The ID, Name and CPF fields appear in the main screen. Also, on the same line, the "Preview" button appears, which should open a modal, in which the database information for that client (ID) should be loaded. Below is the code that generates the list with the 4 columns.

            <tbody>
            <?php
            $result2 = mysqli_query($user->mysqli, $sql) or die(mysqli_error());
            while($row = mysqli_fetch_array($result2)) {
                ?>
                <tr>

                    <th><?php echo $row[0]; ?></th>
                    <th class="ls-txt-center"><?php echo $row[1];?></th>
                    <th class="ls-txt-center"><?php echo $row[2]; ?></th>
                    <th class="ls-txt-center">
                    <a class="ls-btn" href="" data-ls-module="modal" data-target="#ModalUpdate" class="bg-customer-support" >Visualizar</a>
                    </a>
                    </th>
                </tr>
                <?php
            }
            ?>

        </tbody>

Follow the modal:

 <div class="ls-modal" id="ModalUpdate">
    <form class="ls-form ls-form-horizontal row" method="POST" action="modal_clientes.php">     
    <input type="hidden" id='id' name='$id' value="">
    <div class="ls-modal-box">
        <div class="ls-modal-header">
            <a href="clientes.php" data-dismiss="modal">&times;</a>
            <h1 class="ls-modal-title">Visualizar</h1>
        </div>
        <div class="ls-modal-body" id="myModalBody">
        <table class="ls-table">
            <tr>
            <td style='width:20%'><label for="id_update">ID:</label></td>
            <td style='width:80%'><input type="text" style='width:100%' name="id_update" id="id_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="nome_update">Nome:</label></td>
            <td style='width:80%'><input type="text" style='width:100%' name="nome_update" id="nome_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="nascimento_update">Data Nascimento:</label></td>
            <td style='width:80%'><input type="date" min="1901-01-02" max="2050-12-31" style='width:50%' name="nascimento_update" id="nascimento_update" class="ls-mask-date" placeholder="AAAA-MM-DD" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="sexo_update">Sexo:</label></td>
            <td style='width:80%'><select name="sexo_update" type="text" id="sexo_update">
            <option value="M">Masculino</option>
            <option value="F">Feminino</option>
            </select>
            <span class="style1">*      </span></td>
            </td>
            </tr>
            <tr>
            <td style='width:20%'><label for="rg_update">RG:</label></td>
            <td style='width:80%'><input type="text" style='width:50%' name="rg_update" id="rg_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="orgao_emissor_update">Órgão emissor:</label></td>
            <td><input type="text"  style='width:50%' name="orgao_emissor_update" id="orgao_emissor_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ufEmissor_update">UF:</label></td>
            <td style='width:30%'><select name="ufEmissor_update" type="text" id="ufEmissor_update">
            <option>Selecione...</option>
            <option value="AC">AC</option>
            <option value="AL">AL</option>
            <option value="AP">AP</option>
            <option value="AM">AM</option>
            <option value="BA">BA</option>
            <option value="CE">CE</option>
            <option value="ES">ES</option>
            <option value="DF">DF</option>
            <option value="MA">MA</option>
            <option value="MT">MT</option>
            <option value="MS">MS</option>
            <option value="MG">MG</option>
            <option value="PA">PA</option>
            <option value="PB">PB</option>
            <option value="PR">PR</option>
            <option value="PE">PE</option>
            <option value="PI">PI</option>
            <option value="RJ">RJ</option>
            <option value="RN">RN</option>
            <option value="RS">RS</option>
            <option value="RO">RO</option>
            <option value="RR">RR</option>
            <option value="SC">SC</option>
            <option value="SP">SP</option>
            <option value="SE">SE</option>
            <option value="TO">TO</option>
            </select>
            </td>
            </tr>
            <tr>
            <td style='width:20%'><label for="dataEmissaoRG_update">Data Emissão RG:</label></td>
            <td style='width:80%'><input type="date" min="1901-01-02" max="2050-12-31" style='width:50%' name="dataEmissaoRG_update" id="dataEmissaoRG_update" class="ls-mask-date" placeholder="AAAA-MM-DD" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="cpf_update">CPF:</label></td>
            <td style='width:80%'><input type="text" style='width:50%' name="cpf_update" id="cpf_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ddd1_update">DDD:</label></td>
            <td style='width:20%'><input type="text" style='width:50%' name="ddd1_update" id="ddd1_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="fone1_update">Telefone:</label></td>
            <td style='width:40%'><input type="text" style='width:50%' name="fone1_update" id="fone1_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ddd2_update">DDD:</label></td>
            <td style='width:20%'><input type="text" style='width:50%' name="ddd2_update" id="ddd2_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="fone2_update">Telefone:</label></td>
            <td style='width:40%'><input type="text" style='width:50%' name="fone2_update" id="fone2_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ddd3_update">DDD:</label></td>
            <td style='width:20%'><input type="text" style='width:50%' name="ddd3_update" id="ddd3_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="fone3_update">Telefone:</label></td>
            <td style='width:40%'><input type="text" style='width:50%' name="fone3_update" id="fone3_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ddd4_update">DDD:</label></td>
            <td style='width:20%'><input type="text" style='width:50%' name="ddd4_update" id="ddd4_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="fone4_update">Telefone:</label></td>
            <td style='width:40%'><input type="text" style='width:50%' name="fone4_update" id="fone4_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="ddd5_update">DDD:</label></td>
            <td style='width:20%'><input type="text" style='width:50%' name="ddd5_update" id="ddd5_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="fone1_update">Telefone:</label></td>
            <td style='width:40%'><input type="text" style='width:50%' name="fone5_update" id="fone5_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="endereco_update">Endereço:</label></td>
            <td style='width:30%'><input type="text" style='width:100%' name="endereco_update" id="endereco_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="bairro_update">Bairro:</label></td>
            <td style='width:30%'><input type="text" style='width:100%' name="bairro_update" id="bairro_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="cidade_update">Cidade:</label></td>
            <td style='width:30%'><input type="text" style='width:100%' name="cidade_update" id="cidade_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="cep_update">CEP:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' name="cep_update" id="cep_update" class="ls-mask-cep" placeholder="99999-000" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="estado_update">UF:</label></td>
            <td><select name="estado_update" type="text" id="estado_update">
            <option>Selecione...</option>
            <option value="AC">AC</option>
            <option value="AL">AL</option>
            <option value="AP">AP</option>
            <option value="AM">AM</option>
            <option value="BA">BA</option>
            <option value="CE">CE</option>
            <option value="ES">ES</option>
            <option value="DF">DF</option>
            <option value="MA">MA</option>
            <option value="MT">MT</option>
            <option value="MS">MS</option>
            <option value="MG">MG</option>
            <option value="PA">PA</option>
            <option value="PB">PB</option>
            <option value="PR">PR</option>
            <option value="PE">PE</option>
            <option value="PI">PI</option>
            <option value="RJ">RJ</option>
            <option value="RN">RN</option>
            <option value="RS">RS</option>
            <option value="RO">RO</option>
            <option value="RR">RR</option>
            <option value="SC">SC</option>
            <option value="SP">SP</option>
            <option value="SE">SE</option>
            <option value="TO">TO</option>
            </select>
            </td>
            </tr>
            <tr>
            <td style='width:20%'><label for="matricula1_update">Matrícula 1:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' name="matricula1_update" id="matricula1_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="codMatricula1_update">Cod. Matrícula 1:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' name="codMatricula1_update" id="codMatricula1_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="matricula2_update">Matrícula 2:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' name="matricula2_update" id="matricula2_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="codMatricula1_update">Cod. Matrícula 2:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' name="codMatricula2_update" id="codMatricula2_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="banco_emp_update">Banco empréstimo:</label></td>
            <td><select name="banco_emp_update" type="text" id="banco_emp_update">
            <option>Selecione...</option>
            <option value="Banco do Brasil">BANCO DO BRASIL</option>
            <option value="BMG">BMG</option>
            <option value="Banrisul">BANRISUL</option>
            <option value="Bradesco">BRADESCO</option>
            <option value="Caixa">CAIXA</option>
            <option value="ViaCredi">VIACREDI</option>
            <option value="HSBC">HSBC</option>
            </select>
            </tr>
            <tr>
            <td style='width:20%'><label for="credito_update">Crédito:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' oninput="mascara(this,mvalor)" placeholder="9999.99" name="credito_update" id="credito_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="valor_update">Valor:</label></td>
            <td style='width:30%'><input type="text" style='width:50%' oninput="mascara(this,mvalor)" placeholder="9999.99" name="valor_update" id="valor_update" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="status_update">Status:</label></td>
            <td><select name="status_update" type="text" id="status_update">
            <option>Selecione...</option>
            <option value="Ativo">Ativo</option>
            <option value="Inativo">Inativo</option>
            <option value="Falecido">Falecido</option>
            </select>
            </tr>
            <tr>
            <td style='width:20%'><label for="retorno_update">Data Retorno:</label></td>
            <td style='width:80%'><input type="date" min="1901-01-02" max="2050-12-31" style='width:50%' name="retorno_update" id="retorno_update" class="ls-mask-date" placeholder="AAAA-MM-DD" /></td>
            </tr>
            <tr>
            <td style='width:20%'><label for="observacao_udpate">Observação:</label></td>
            <td style='width:80%'><textarea rows="10"  style='width:100%' name="observacao_udpate" id="observacao_udpate"></textarea></td>
            </tr>
        </table>
        </div>
        <div class="ls-modal-footer">
            <button href="clientes.php" class="ls-btn ls-float-right" data-dismiss="modal">Cancelar</button>
            <button type="submit" class="ls-btn-primary">Salvar</button>
        </div>
    </div>
    </form>
</div>

In addition, I have another file, modal_clientes.php, with the following code:

   <?php
  $nome = $_POST['nome_update'];
  $nascimento = $_POST['nascimento_update'];
  $sexo = $_POST['sexo_update'];
  $rg = $_POST['rg_update'];
  $orgao_emissor = $_POST['orgao_emissor_update'];
  $ufEmissor = $_POST['ufEmissor_update'];
  $dataEmissaoRG = $_POST['dataEmissaoRG_update'];
  $cpf = $_POST['cpf_update'];
  $ddd1 = $_POST['ddd1_update'];
  $fone1 = $_POST['fone1_update'];
  $ddd2 = $_POST['ddd2_update'];
  $fone2 = $_POST['fone2_update'];
  $ddd3 = $_POST['ddd3_update'];
  $fone3 = $_POST['fone3_update'];
  $ddd4 = $_POST['ddd4_update'];
  $fone4 = $_POST['fone4_update'];
  $ddd5 = $_POST['ddd5_update'];
  $fone5 = $_POST['fone5_update'];
  $endereco = $_POST['endereco_update'];
  $bairro = $_POST['bairro_update'];
  $cidade = $_POST['cidade_update'];
  $cep = $_POST['cep_update'];
  $matricula1 = $_POST['matricula1_update'];
  $codMatricula1 = $_POST['codMatricula1_update'];
  $matricula2 = $_POST['matricula2_update'];
  $codMatricula2 = $_POST['codMatricula2_update'];
  $banco_emp = $_POST['banco_emp_update'];
  $credito = $_POST['credito_update'];
  $valor = $_POST['valor_update'];
  $status = $_POST['status_update'];
  $retorno = $_POST['retorno_update'];
  $observacao = $_POST['observacao_update'];
  $id = $_POST['id_update'];

$host = 'localhost'; 
$user = 'root'; 
$pass = ''; 
$database = 'vale'; 

@$conexao = mysql_connect($host,$user,$pass) or die ("Can not connect with database.");
$charset = mysql_set_charset('UTF-8', $conexao);
mysql_select_db($database,$conexao) or die ("Can't select the database.");



  $sql = "update cadastro_mailing
             set nome = '$nome',
                 nascimento = '$nascimento',
                 sexo = '$sexo',
                 orgao_emissor = '$orgao_emissor',
                 uf_emissor = '$ufEmissor',
                 data_emissao = '$data_emissao',
                 cpf = '$cpf',
                 DDD_fone1 = '$ddd1',
                 fone1 = '$fone1'
                 DDD_fone2 = '$ddd2',
                 fone2 = '$fone2'
                 DDD_fone3 = '$ddd3',
                 fone3 = '$fone3'
                 DDD_fone4 = '$ddd4',
                 fone4 = '$fone4'
                 DDD_fone5 = '$ddd5',
                 endereco = '$endereco',
                 bairro = '$bairro',
                 cidade = '$cidade',
                 cep = '$cep',
                 matricula_1 = '$matricula1',
                 cod_matricula_1 = '$codMatricula1',
                 matricula_2 = '$matricula2',
                 cod_matricula_2 = '$codMatricula2',
                 banco_emp = '$banco_emp',
                 valor = '$valor'
                 status = '$status',
                 retorno = '$retorno',
                 observacao = '$observacao',                 
           where id = '$id'";
  $resultado = mysql_query($sql, $conexao) or die ($sql);
  header("Location: clientes.php");
?>

The modal opens, however, without the client data. How can I resolve this?

Thank you!

    
asked by anonymous 13.07.2016 / 19:22

2 answers

2

After much tinkering, I discovered that the error was in the parameters. The jquery was pulling some wrong parameters, there was no load in the modal. I was putting it one by one and testing it, and it worked. Thanks to all who tried to help!

    <script>
function carregar_update(param1, param2, param3, param4, param5, param6, param7, param8, param9, param10, param11, param12, param13, param14, param15, param16, param17, param18, param19, 
                        param20, param21, param22, param23, param24, param25, param26, param27, param28, param29, param30, param31, param32, param33, param34) {
        $("#id_update").val(param1);
        $("#nome_update").val(param2);
        $("#nascimento_update").val(param3);
        $("#sexo_update").val(param4);
        $("#rg_update").val(param5);
        $("#orgao_emissor_update").val(param6); 
        $("#uf_emissor_update").val(param7);        
        $("#data_emissao_update").val(param8);
        $("#cpf_update").val(param9);
        $("#ddd1_update").val(param10);
        $("#fone1_update").val(param11);
        $("#ddd2_update").val(param12);
        $("#fone2_update").val(param13);
        $("#ddd3_update").val(param14);
        $("#fone3_update").val(param15);
        $("#ddd4_update").val(param16);
        $("#fone4_update").val(param17);
        $("#ddd5_update").val(param18);
        $("#fone5_update").val(param19);
        $("#endereco_update").val(param20);
        $("#bairro_update").val(param21);
        $("#cidade_update").val(param22);
        $("#cep_update").val(param23);
        $("#uf_update").val(param24);
        $("#matricula_1_update").val(param25);
        $("#cod_matricula_1_update").val(param26);
        $("#matricula_2_update").val(param27);
        $("#cod_matricula_2_update").val(param28);
        $("#banco_emp_update").val(param29);
        $("#credito_update").val(param30);
        $("#valor_update").val(param31);
        $("#status_update").val(param32);
        $("#retorno_update").val(param33);
        $("#observacao_update").val(param34);
    }
</script>
    
18.07.2016 / 14:31
0

At the end of the block called by modal, the page should end with exit(); , because it will only call the block (I imagine that by ajax) of the code.

EDIT: DO NOT USE THE HEADER! It does not return the values. Use this page as AJAX, returning these values in a JSON, Array, HTML mounted, as you prefer. Well that might be your problem with the code.

    
13.07.2016 / 19:36