简体   繁体   中英

Getting values from php dynamically created checkboxes with jquery

This is not a duplicate of a question suggested as duplicate as this question has nothing to do with event binding

Hi, Im trying to get the value of a check box to send in a ajax request to a php page, the checkboxes are dynamically created using php. So far my code allows me to show an instruction to the user telling the user to choose an admin to delete from the list dynamically created. Then when a checkbox is checked the instrcution hides and the delete admin button is shown. Next on clicking the delete button I'm trying to confirm the user wants to delete the admin chosen and click to confirm or cancel. The real problem I'having is getting the value of the chosen checked checkbox to pass to the php processing page, so far I have managed to get the value of the first checkbox to pass no matter which checkbox is checked

Jquery

<script type="text/javascript">

$(document).ready(function() {

    var checkboxes = $("input[type='checkbox']");

checkboxes.click(function() {
    $('.delete_admin_but').show();
    $('#adminDeleteNotice').hide();
    var deleteAdminName=$(this).attr('id');
});

    $(".delete_admin_but").click(function() {



//  if(confirm("Are you sure you want to delete the Admin")) {

    $("#deleteAdminError").html('<img src="image/ajax-loader.gif" width="16" height="16" alt=""/>');




$.post("includes/delete_admin.inc.php",{deleteAdminname:deleteAdminName},function(json)   {
    if(json.result === "success") {
        $("#deleteAdminError").html(json.message);
//  $('.add_intern').get(0).reset();
    }else{
        $("#deleteAdminError").html(json.message);
    }
});



});//submit click
});//doc ready
</script>

html form

<div id="deleteAdmin" style="display:none">

<form id="adminDelete">

          <div class="delete_admin_list">

            <?php while($row = mysqli_fetch_array($result1)) { ?>

              <input type="checkbox" id="<?php echo $row['name']; ?>" value="<?php echo $row['id']; ?>" name="delete[]" class="checkboxAdmin" />

              <div id="admin_db_detail"><?php echo $row['name']; ?> - <?php echo $row['email']; ?></div>

              <?php } ?>

      </div>        


<div id="adminDeleteNotice" style="display:block">Please Choose an Admin to Delete</div>

<input name="delete_admin_but" id="delete_admin_but" type="button" class="delete_admin_but" value="Delete Admin" style="display:none"/>

</form>

<div id="deleteAdminError"></div>

</div>

If anyone could help me figure this out I would be greatful

I have figured this out now, so posting to show how and to make a point that this had no relevance to the suggested duplication of question as was suggested. Maybe those who suggest these duplicates should read the question properly first, and then the question they are suggesting as being duplicated to really see if there is any relevance, However just in case I'm wrong I will be very happy to withdraw this comment should someone show me the relevance of the suggested question with the question I posted and providing a solution for.

My solution

jquery changed to the following

<script type="text/javascript">

$(document).ready(function() {

    var checkboxes = $("input[type='checkbox']");

checkboxes.click(function() {
    $('.delete_admin_but').show();
    $('#adminDeleteNotice').hide();

});

    $(".delete_admin_but").click(function() {

$.post("includes/delete_admin.inc.php",{ checked_box : $('input:checkbox:checked').val()},function(json)   {
    if(json.result === "success") {
        $("#deleteAdminError").html(json.message);
//  $('.add_intern').get(0).reset();
    }else{
        $("#deleteAdminError").html(json.message);
    }
});
        });//submit click
});//doc ready
</script>

The change I have made from the original script is with the $.post line

Original code

$.post("includes/delete_admin.inc.php",{deleteAdminname:deleteAdminName},function(json)   {

New code that gets the checkbox value from the checkbox that is chosen

$.post("includes/delete_admin.inc.php",{ checked_box : $('input:checkbox:checked').val()},function(json)   {

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM