Ajaxが値を返した後のPHP投稿

Question

何らかの理由でPOSTの変数がformから常に空です。ここに私のコードです... 私は、ドロップダウン（選択）から新しい項目を選択すると表示される情報を返すブートストラップの選択肢を持っています。

コード：

$(function() { 


    $("#shiftsDD").change(function(){ 
     var selectedItemId = $('#shiftsDD option:selected').val(); 

     $.post('/step/services/shiftInfo.php', { shiftID : selectedItemId }, function(res){ 
      $("#shiftCard").show(); 
      var jsonRes = $.parseJSON(res); 
      $("#address").html(jsonRes[0]); 
      $("#duties").html(jsonRes[1]); 
      $("#employer").html(jsonRes[4]); 
      $("#payRate").html(jsonRes[5]); 
      $("#theShiftID").html(jsonRes[6]); 
      console.log(res); 

     }); 
    }); 

}); 

jsonRes配列から、これらの値のすべてがここに割り当てられます。

<form role="form" name="cardForm" method="POST"> 
<div class="card" id="shiftCard"> 
Employer: 
<h3 id="employer">Test Employer</h3><br> 
Address: 
<h3 id="address">Test Address</h3><br> 
Duties include: 
<h3 id="duties">Test duties</h3><br> 
Pay rate: 
<h3 id="payRate">Test PayRate</h3><br> 
<h5 id="theShiftID" name="myShiftID"></h5> 
<br> 
<button type="submit" class="btn btn-lg btn-green-solid" name="shiftsBtn">Accept work</button> 
</div> 
</form> 

私は物事の多くを試みたが、私はアヤックスではなくプロに新しいですなぜPHPで私は知りません。

if (isset($_POST['shiftsBtn'])) { 

$theId = $_POST['myShiftID']; 
... 

myShiftIDは常に空です

は、コードを選択ShiftsDD：

Answer 1

[OK]を使用すると、以下の一致するフォームを変更する必要がありますので。変更する必要のない要素を削除しました。 h5を入力に変更することに注意してください。

<form role="form" name="cardForm" method="POST"> 
<div class="card" id="shiftCard"> 
<input id="theShiftID" name="myShiftID" value="" /><br /> 
<button type="submit" class="btn btn-lg btn-green-solid" name="shiftsBtn">Accept work</button> 
</div> 
</form> 

フォームの変更を加えた後、次に、あなたは（.htmlをからあなたのjsを変更する必要があります）（.valする）

$(function() { 
    $("#shiftsDD").on('change', function(){ 
     var selectedItemId = $(this).val(); 

     $.post('/step/services/shiftInfo.php', { shiftID : $(this).val() }, function(res){ 
      $("#shiftCard").show(); 
      var jsonRes = $.parseJSON(res); 
      $("#theShiftID").val(jsonRes[6]);  
     }); 
    }); 

});