Ajax混合HTML和JSON格式

时间:2016-01-14 08:23:35

标签: php jquery arrays json ajax

由于这个ajax功能,我尝试在不同的div中发送数据,但它不起作用。

由于这种形式,用户将在列表中选择一个选项,ajax函数将返回一些数据,这要归功于一个数组,在salarie和Formation div中,但是当我选择一个选项时没有任何事情发生..

我的php文件:

if(isset($_POST['idSalarie'])){ 
$displayForm = $bdd->prepare(
    'SELECT poste_nom, ups_type_contrat, serv_nom, serv_id_resp, user_credit_cpf, user_indice_salarial,
     FLOOR( DATEDIFF( CURDATE( ) , user_dateentree ) /365 ) AS dateEntree 
     FROM USER 
     INNER JOIN USER_POSTE_SERVICE 
        ON USER.user_id= USER_POSTE_SERVICE.ups_poste_id  
     INNER JOIN POSTE 
        ON USER_POSTE_SERVICE. ups_poste_id = POSTE.poste_id 
     INNER JOIN SERVICE 
        ON USER_POSTE_SERVICE.ups_id_serv = SERVICE.serv_id 
     WHERE user_id = :idSalarie 
        ORDER BY user_nom ASC');
$displayForm->bindParam(':idSalarie', $_POST['idSalarie']);
$displayForm->execute();
$resDisplayForm=$displayForm->fetch(PDO::FETCH_ASSOC);
$data = array( 'resDisplayForm'=>'');
foreach ($resDisplayForm as $key => $value) {
    $data['resDisplayForm'][$key] .=  $value;
}

$data['salarie'] = '          
    <div class="form-group">
        <label for="poste_nom" class="col-sm-2 control-label">Poste occupé</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" name="poste_nom" readonly>
        </div>
    </div>';

$data['formation'] = '
    <div class="form-group">
        <label for="user_credit_cpf" class="col-sm-2 control-label" readonly>Crédits CPF</label>
        <div class="col-sm-2">
            <input type="text" class="form-control" name="user_credit_cpf" readonly>
        </div>
    </div>';}

echo json_encode($data);die;

我的Ajax功能:

jQuery(document).ready(function($) {
$('#idSalarie').change(function(){
    var req=$('#idSalarie').val();
    $.ajax({
        type: "POST",
        url: "lib/function.php",
        data: "idSalarie="+req,
        dataType : "json",
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert(XMLHttpRequest + '--' + textStatus + '--' + errorThrown);
        },
        success:function(data){
            //On affiche la réponse du serveur
            $('.salarie').empty();
            $('.salarie').prepend(data.salarie);
            $('input[name=poste_nom]').val($('input:hidden[name=poste_nom]').val());

            $('.formation').empty();
            $('.formation').prepend(data.formation)
            $('input[name=user_credit_cpf]').val(data.resDisplayForm.user_credit_cpf).val());
        }
    });
  });
}); 

我的HTML文件:

$displaySalarie = $bdd->query('SELECT user_id, user_prenom, user_nom FROM USER ORDER BY user_nom ASC');
    <form class="form-horizontal" name="formEtape1" id="formEtape1" method="post">
      <div role="tabpanel" class="tab-pane active" id="Etape-1">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Information Salarié</h3>
            </div>
            <div class="panel-body">
              <div class="form-group">
                <label for="nomSalarie" class="col-sm-2 control-label">Nom</label>
                <div class="col-sm-10">
                  <select class="form-control" name="nomSalarie" id="idSalarie">
                      <option disabled selected>Choisir un salarié</option>
                      <?php while($ligne = $displaySalarie->fetch()){?>
                      <option value="<?php echo $ligne['user_id'];?>"><?php echo $ligne['user_nom'].' '.$ligne['user_prenom'];?></option>
                      <?php } ?>
                    </select>
                </div>
              </div>
              <div class="salarie"></div>        
            </div>
          </div>
          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Informations Entretien</h3>
            </div>
            <div class="panel-body">
           <div class="formation"></div>
            </div>
       </form>

0 个答案:

没有答案