如何從Ajax/Jquery的下拉列表中獲取複選框中的數據

我不是在這裏發佈完整的代碼，但我想知道如何基於下拉列表檢索checboxes中的數據。我有一個用戶下拉列表，以及複選框中的頁面數據。如何從Ajax/Jquery的下拉列表中獲取複選框中的數據

假設表user有兩列（user_id，user）和pages有三列（page_id，user_id，title）。

我希望這些cheboxes根據選定的用戶自動檢查/取消選中，而無需刷新頁面。假如我是獲取用戶的

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相比，但不是在查詢）

$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; 
    } 
}

怎麼可能在阿賈克斯/ Jquery我的意思是沒有刷新頁面。希望你明白我的意思。感謝

來源

2012-10-05 Bheem

只需用您從ajax調用中檢索到的'select'元素替換它並完成它呢？ – dbf

感謝您的回覆，但主要的是我需要的是ajax代碼，我沒有ajax的知識:( – Bheem

err ..然後開始閱讀關於ajax的做法？最快和最簡單的方法是使用像[jQuery] （http://www.jquery.com）的使用許多[ajax]（http://api.jquery.com/category/ajax/）方法之一 – dbf

這裏是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調用上的選擇框的更改事件。我在這裏要使用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。

來源

2012-10-06 04:24:23

非常感謝:) – Bheem

不客氣：） –

如何從Ajax/Jquery的下拉列表中獲取複選框中的數據

回答

相關問題