使用jquery更新數據表中的表格行

Question

如何使用jQuery ajax來處理checked複選框？然後，我如何將html表格中的每個checked複選框發送到ajax.php？

這是我到目前爲止已經試過：

ajax.php

session_start(); 
if (isset($_POST['id']) && isset($_POST['to']) && isset($_SESSION['user']['id'])) { 
    if (is_numeric($_POST['id']) && is_numeric($_POST['to'])) { 
     include("mysql_connector.php"); 
     $user = $_SESSION['user']['id']; 
     $sendTo = mysql_real_escape_string(trim($_POST['to'])); 
     foreach ($_POST['id'] as $id) { 
      $id = mysql_real_escape_string(trim($id)); 
      mysql_query("UPDATE `email` SET status = '$sendTo' WHERE `email_id` = '$id' AND `userid` = '$user'"); 
     } 
    } 
} 

Javascript:

$(".submit").click(function() { 
    var id = $("#id").val(); 
    var to = $("#bins").val(); 
    var dataString = 'id=' + id + '&to=' + to; 
    $.ajax({ 
     type: "POST", 
     url: "ajax.php", 
     data: dataString, 
    }); 
}); 

html:

<form method="POST"> 
    <table id="inventory" class="table"> 
     <thead> 
      <tr> 
       <th style="text-align: center;"><a href="#" name="checkall" id="checkall" onclick="checkAll(this)" class="checkall">Check All</a></th> 
       <th>Time Received</th> 
       <th>Email</th> 
       <th>Subject</th> 
       <th>ID</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr class="email"> 
       <td style="text-align: center;"><input type="checkbox" name='msg[]' class="id" value="2" /></td> 
       <td>1231231</td> 
       <td>test</td> 
       <td>test</td> 
       <td>0</td> 
      </tr> 
      <tr class="email"> 

       <td style="text-align: center;"><input type="checkbox" name='msg[]' class="id" value="3" /></td> 
       <td>1231231</td> 
       <td>test</td> 
       <td>test</td> 
       <td>1</td> 
      </tr> 
     </tbody> 

    </table> 
    </br> 
    <select name="bins" class="bins"> 
     <option value="1">Archive</option> 
     <option value="2">Read</option> 
     <option value="3">Unread</option> 
     <option value="4">Save</option> 
    </select> 
    <input type="submit" name="move" value="Move" class="submit" style="width:auto;"/> 
</form> 

謝謝你的閱讀。

Answer 1

首先，使用重複ID爲的多個dom元素是無效的。如果這些複選框需要id，使它們獨一無二。如果他們不需要IDS，那麼就完全放棄它們。

---

要獲得所有的複選框的值檢查的列表，這樣做：

var checkedVals = []; 
$("input[type='checkbox']:checked").each(function() { 
    checkedVals.push($(this).val()); 
}); 

或者你也可以通過名字取複選框的不同羣體：

var checkedMsgVals = []; 
$("input[name='msg[]']:checked").each(function() { 
    checkedMsgVals.push($(this).val()); 
}); 

要送這些給php，當你撥打電話時，只需將它們包含在你的數據包中。要做到這一點，你會想發送一個對象，而不是查詢字符串。

var dataObj = {'id': id, 'to': to, 'checkedValues': checkedMsgVals }; 

$.ajax({ 
    type: "POST", 
    url: "ajax.php", 
    data: dataObj, 
});