如何从Ajax / Jquery中的下拉列表中获取复选框中的数据

时间:2012-10-05 20:23:39

标签: php ajax jquery checkbox

我不是在这里发布完整代码但我想知道如何根据下拉列表检索checbox中的数据。我有一个用户下拉列表,以及复选框中的页面数据。

假设表格user有两列(user_iduser),pages有三列(page_iduser_id,{{ 1}})。

我希望这些cheboxes能够根据所选用户自动检查/取消选中,而无需刷新页面。假设我正在以

的形式提取用户
title

基于所选用户的复选框中的数据(确保在echo '<select name="user_id">'; echo '<option value="">Select User</option>'; $sql = "SELECT * from users"; $res = mysql_query($sql); while($row = mysql_fetch_assoc($res)) { $uid = $row['user_id']; $user = $row['user']; echo '<option value="'.$uid.'">'.$user.'</option>'; } echo '</select>'; 中比较user_id,但在查询中不进行比较)

IF condition

如何在Ajax / Jquery中实现我的意思是没有刷新页面。 希望你明白我的意思。 感谢

1 个答案:

答案 0 :(得分:1)

这是asnwer你可以做的就像这样

 echo '<select name="user_id" id="userCombo">';
 echo '<option value="">Select User</option>';

 $sql = "SELECT * from users";
 $res = mysql_query($sql);
 while($row = mysql_fetch_assoc($res)) {
    $uid = $row['user_id'];
    $user = $row['user'];
    echo '<option value="'.$uid.'">'.$user.'</option>'; 
 }

echo '</select>';
echo '<div id="userCheckBoxes"></div>'

现在将ajax调用放在选择框的change事件上。 我在这里要使用jquery ajax。

<script type="text/javascript">
 $(document).ready(function()
 {
   $("#userCombo").change(function()
   {
     var id=$(this).val();
     var dataString = 'user_id='+ id;
     $.ajax
     ({
         type: "POST",
         url: "ajax_checkboxes.php",
         data: dataString,
         cache: false,
         success: function(html)
         {
            $("#userCheckBoxes").html(html);
         }
     });
   });
 });
 </script>

现在将ajax_checkboxes.php放入同一目录。 然后将下面的代码放入ajax_checkboxes.php。我假设您可以自己建立数据库连接。

  $user_id = $_POST['user_id']; //selected user from list

  $query = "SELECT * from pages";
  $result = mysql_query($query);
  while($rowPage = mysql_fetch_assoc($result)) {

       $upid = $rowPage['user_id'];
       $pid = $rowPage['page_id'];
       $title = $rowPage['title'];

    if($upid == $user_id) {
        echo '<input type="checkbox" name="userPages[]" value="'.$pid.'"        checked="checked"> '.$title;   
     } else {
        echo '<input type="checkbox" name="userPages[]" value="'.$pid.'"> '.$title;
    }
 }

我没有在我的本地服务器上品尝它,但我相信它会起作用。

PS不要在你网站的主题部分包含jQuery。