Popular combo with ajax call

Navigation
0

Well folks, I would like to add a data and at the same time update the ajax that is next to ...

In the code I inform the content and after selecting the new button I add the content and update the peripheral with AJAX . 

<form name="sai_frm_alte_excl_mode">
<body>
    <table border="0" width="100%">
        <tr>
            <td colspan="3" bgcolor="Silver" align="center">
            <b><font face="arial" color="blue" size="2">Outros Periféricos</font>
            </td>
        </tr>
    </table><br>
    <table border="0" width="100%">
        <tr>
            <td align="right" width="25%">
            <font face=arial color="blue" size=2>Descrição :</font>
            </td>
            <td width="70%" align="left" colspan="3">   
                <input type="text" align="left" size="40" maxlength="45" value="">
            </td>  
            <td width="40%" align="center">
                <button type="submit" style="width:65"><image src="../sai_imag/novo-reg.ico" ></button>
            </td>
        </tr>
<tr>
    <td align=right width=10% >
        <font face=arial color=blue size=2>Periférico :</font>
    </td>
    <td id="td_fk_seq_mode" colspan="3">
    <select name="nm_cb_fk_seq_mode" id="id_cb_fk_seq_mode" style="font-size:13; color:#FF7F00;" width="250">
        <option id="opc_fk_seq_mode" value="0"> ==>Selecione o Periférico<==
        </option>
    </select>
    </td>
</tr>

But since I do not have much sense of how to do inclusão and at the same time update AJAX , I came to ask you for support .. Any tips?

    
asked by anonymous 23.07.2014 / 14:54

1 answer

1

To receive and update via Ajax , do so

HTML 

<table>
    <tr>
        <td>
            <label for="descricao">Descrição:</label>
        </td>
        <td>
            <input type="text" id="descricao" class="descricao" />
        </td>
        <td>
            <button type="button" id="Add">Adicionar</button>
        </td>
    </tr>

    <tr>
        <td>
            <label for="periferico">Periférico</label>
        </td>
        <td>
            <select name="periferico" id="periferico">
                <option value="-1" disabled selected>Selecione o Periférico</option>
            </select>
        </td>
    </tr>
</table>

JQuery 

$(function(){
    $('#Add').click(function(e){
        e.preventDefault();
        var str = $('#descricao').val();
        var removeEspaco = str.replace(/^\s+|\s+$/g,"");

        if(removeEspaco.length != 0) {

            $.post( "exemplo.php", { periferico: str })
              .done(function( data ) {
                  if(data.status)
                      $('#periferico').append('<option value="'+data.perifericoID+'">'+data.periferico+'</option>');
                  else
                      alert("Erro ao inserir, tente novamente");
              });
        }
        else
            alert("Por favor digite uma descrição");
    });
});

PHP (example.php) 

<?php

$data = array (
    'status'    => false
);

if($_POST)
{
    $periferico = $_POST['periferico'];

    if(strlen(trim($perifetico)) != 0)
    {
        //execucao da sua logica para salvar no banco de dados//

        $data = array(
            'status'        => true,
            'periferico'    => $resultadoQuery['periferico'],
            'perifericoID'  => $resultadoQuery['cdPeriferico']
        );
    }
}

echo json_encode($data);

?>

The above code will receive via POST the value of the field, done the treatment of the data it will return%% of the data to the client.

I believe that with this base you can develop the rest of your application, adapt to its structure.

    
23.07.2014 / 15:42
Payment by mobile phone credit [duplicate] How to change the font in the RichTextBox?