从$ .post结果创建的复选框中获取值

Question

我有一组从$ .post返回结果创建的复选框。每次从下拉列表中选择不同的人时，都会创建这些复选框，每个人都会显示不同的人。

$.post("api.php/atherapists", {clientID: clientID}).done(function(data){
  var data = JSON.parse(data);
  var trHTML = '';
  $.each(data, function(i, item){
      therapistID = item.therapist_id;
      therapistName = item.therapist_name;
      trHTML += '<tr><td><input type="checkbox" name="achkbox" id="achkbox" value="' + therapistID + '"></td><td>' + therapistName + '</td></tr>';
  });
  $('#tableAvailable').empty();
  $('#tableAvailable').append(trHTML);
});

我的问题是在单击复选框时从复选框中获取值。我计划在单击一个复选框并将其值发送到PHP上时，从$ .POST中从MySQLI查询中射击。每次我尝试提醒检查复选框的值时，什么也不会发生。我尝试了这些

$("input[name='achkbox']").change(function(){
    alert($(this).attr('value'));       
});
$('#achkbox').click(function(){
    alert($(this).attr('value'));        
});
$('#achkbox').change(function(){
    var id = $(this).val();
    if(id != null){
        alert(id);
    }
});

似乎没有什么可以返回/显示我需要发送给PHP来处理该人的值。我可以弄清楚如何即时将数据发送到PHP，我只是无法弄清楚我在获得该值时做错了什么。

编辑-2/23/2017 我已经实施了Fermin的建议，但这是我的困境

$.post("api.php/atherapists", {clientID: clientID}).done(function(data){
    var data = JSON.parse(data);
    var table = $('#tableAvailable');
    var trHTML = '';
    $('#tableAvailable').empty();
    $.each(data, function(i, item){
        therapistID = item.therapist_id;
        therapistName = item.therapist_name;
        var tr = $('<tr></tr>');
        var td1 = $('<td></td>');
        var td2 = $('<td></td>');
        var checkbox = $('<input type="checkbox" name="achkbox" id="achkbox" value="' + therapistID + '" >').click(function(){
           var theraID = $(this).val();
           //fire ajax call to assign selected therapist to client
           $.post("api.php/assignsave", {clientID: clientID, therapist: theraID}).done(function(data){
           //after assignment refresh the table by running $.post("api.php/atherapists) again
           //maybe making this whole thing a function then recalling it after post
           });

        });
     tr.append(td1.append(checkbox)).append(td2.append(therapistName));
     table.append(tr);
   });

});

编辑2/23/2017 9:55 AM

使用Fermin的解决方案和一些功能的混合物使它起作用。这是我所做的

function getATherapists(clientID){
    $.post("api.php/atherapists", {clientID: clientID}).done(function(data){
        var data = JSON.parse(data);
        var table = $('#tableAvailable');
        var trHTML = '';
        $('#tableAvailable').empty();
        $.each(data, function(i, item){
            therapistID = item.therapist_id;
            therapistName = item.therapist_name;
            var tr = $('<tr></tr>');
            var td1 = $('<td></td>');
            var td2 = $('<td></td>');
            var checkbox = $('<input type="checkbox" name="achkbox" id="achkbox" value="' + therapistID + '" >').click(function(){
            var theraID = $(this).val();
            //assign therapist to client
            $.post("api.php/assignsave", {clientID: clientID, therapist: theraID}).done(function(data){
                //call getATherapists function
                getATherapists(clientID);
                //create a new function to get current therapists since getCTherapists is further down the list  
                function getCurrentTherapists(clientID){
                    $.post("api.php/ctherapists", {clientID: clientID}).done(function(data){
                        var data = JSON.parse(data);
                        var table = $('#tableCurrent');
                        var trHTML = '';
                        $('#tableCurrent').empty();
                        $.each(data, function(i, item){
                            therapistID = item.therapist_id;
                            therapistName = item.therapist_name;
                            var tr = $('<tr></tr>');
                            var td1 = $('<td></td>');
                            var td2 = $('<td></td>');
                            var checkbox = $('<input type="checkbox" name="cchkbox" id="cchkbox" value="' + therapistID + '" >').click(function(){
                                var theraID = $(this).val();
                                //assign therapist to client
                                $.post("api.php/removesave", {clientID: clientID, therapist: theraID}).done(function(data){
                                    //rerun getCurrentTherapists & getATherapists                          
                                    getCurrentTherapists(clientID);
                                    getATherapists(clientID);
                                });
                            });
                            tr.append(td1.append(checkbox)).append(td2.append(therapistName));
                            table.append(tr);
                                    });

                                });
                                };
                                getCurrentTherapists(clientID);
                            });

                        });
                        tr.append(td1.append(checkbox)).append(td2.append(therapistName));
                        table.append(tr);
                    });

                });
                };
function getCTherapists(clientID){
                    $.post("api.php/ctherapists", {clientID: clientID}).done(function(data){
                    var data = JSON.parse(data);
                    var table = $('#tableCurrent');
                    var trHTML = '';
                    $('#tableCurrent').empty();
                    $.each(data, function(i, item){
                        therapistID = item.therapist_id;
                        therapistName = item.therapist_name;
                        var tr = $('<tr></tr>');
                        var td1 = $('<td></td>');
                        var td2 = $('<td></td>');
                        var checkbox = $('<input type="checkbox" name="cchkbox" id="cchkbox" value="' + therapistID + '" >').click(function(){
                            var theraID = $(this).val();
                            //assign therapist to client
                            $.post("api.php/removesave", {clientID: clientID, therapist: theraID}).done(function(data){
                                //refresh the available table which would run $.post("api.php/atherapists) again
                                getCTherapists(clientID);
                                getATherapists(clientID);
                            });

                        });
                        tr.append(td1.append(checkbox)).append(td2.append(therapistName));
                        table.append(tr);
                    });

                });
                };

                getATherapists(clientID);
                getCTherapists(clientID);

Answer 1

http://jsfiddle.net/

$(document).ready(function() {
  var data = [
		{therapist_id: 'id1', therapist_name: 'nam1'},
    {therapist_id: 'id2', therapist_name: 'nam2'},
    {therapist_id: 'id3', therapist_name: 'nam4'},
];
var table = $('#tableAvailable');
 var trHTML = '';
  $.each(data, function(i, item){
      therapistID = item.therapist_id;
      therapistName = item.therapist_name;
      var tr = $('<tr></tr>');
      var td1 = $('<td></td>');
      var td2 = $('<td></td>');
			var checkbox = $('<input type="checkbox" name="achkbox" id="achkbox" value="' + therapistID + '">').click(function(){
      	console.log( $( this ).val() );
        alert($( this ).val());
      });
      tr.append(td1.append(checkbox)).append(td2.append(therapistName));
      table.append(tr);
  });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<table id="tableAvailable" >
 
 </table>

o2gxgz9r/3154/＃＆amp; gaterjs = jtihtuulom

尝试这样的东西

    var renderTable = function renderTable(data){
    var data = JSON.parse(data);
        var table = $('#tableAvailable');
        var trHTML = '';
        table.empty();
        $.each(data, function(i, item){
            therapistID = item.therapist_id;
            therapistName = item.therapist_name;
            var tr = $('<tr></tr>');
            var td1 = $('<td></td>');
            var td2 = $('<td></td>');
            var checkbox = $('<input type="checkbox" name="achkbox" id="achkbox" value="' + therapistID + '" >').click(function(){
               var theraID = $(this).val();
               //fire ajax call to assign selected therapist to client
               $.post("api.php/assignsave", {clientID: clientID, therapist: theraID}).done(function(data){
               //after assignment refresh the table by running $.post("api.php/atherapists) again
               //maybe making this whole thing a function then recalling it after post
                renderTable(data);
               });

            });
         tr.append(td1.append(checkbox)).append(td2.append(therapistName));
         table.append(tr);
       });
};
$.post("api.php/atherapists", {clientID: clientID}).done(function(data){
        renderTable(data);
    });