0

I am getting some data from database using AJAX and jQuery from database using while loop and displaying it in bootstrap modal. The data is displaying accurate but when I try to update the record on the bases of displayed records, it gives me the wrong reference id. I have checked my code many time but didn't fine any error. Following is my code, please check it and identify the error so I can get the correct value: -

html modal code:

<div class="modal fade" id="assign">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <div class="bhead">
                    <div class="csr-details"></div>
                </div>
            </div>
        </div>
    </div>  
</div>

jQuery Code:

$(document).on("click", "#editId", function(){
    var parent_id = $(this).data("id");
    $.ajax({
        url: "newSignups.php",
        type: "POST",
        data: {parent_id: parent_id},
        success: function(data){
            jQuery.noConflict(); 
            $('#assign').modal('show');
            $('.csr-details').html(data); 
        }
    });
});

PHP code:

if(isset($_POST['parent_id']))
{
    $parent_id = $_POST['parent_id'];
    $query = mysqli_query($conn, "SELECT * FROM employee WHERE role = 'SuperAdmin' OR role = 'csr' ");
    while ($row = mysqli_fetch_assoc($query))
    {
        extract($row);
        $csr_id = $employee_id;
        echo $csr = "<a id='assign_csr'>
            <div class='modal-div'>
                <table width='100%'>
                    <tr>
                        <td><img src='../$employee_img' width='100' height='100' ></td>
                        <td><sub><sub>Assign To: <hr> </sub></sub> $employee_name <br> <sub><sub>$designation</sub></sub></td>
                        <input type='hidden' id='employeeId' value='$csr_id'>
                        <input type='hidden' id='parent' value='$parent_id'>
                    </tr>
                </table>
            </div>
        ";
    }
}

All this code is working fine but when I try to update the record in database, I only get the employee id of first employee which is 1 following is the jQuery code which I am trying get the employee id:

$(document).on("click","#assign_csr", function(){

        var parent_id = $("#parent").val();
        var employee = $("#employeeId").val();
        alert(employee);
    });
Imran Shahzad
  • 9
  • 1
  • IDs _must_ be unique within an HTML document, but you are elements with the same ID multiple times in your loop. – CBroe Sep 27 '21 at 09:29
  • What have you tried to resolve the problem? Where are you stuck? There's no code given to update anything in the database – Nico Haase Sep 27 '21 at 09:31
  • probably you are not getting the id in the returned data. check in the returned echo $csr statement you are using php variables inside the quotes. Try to make string with concatenate method – Bhanu Pratap Sep 27 '21 at 09:39

1 Answers1

0

don't use id to get the value try using class instead

PHP

 ......
 <input type='hidden' class='employeeId' value='$csr_id'>
 <input type='hidden' class='parent' value='$parent_id'>
 .......

jQuery

$(document).on("click","#assign_csr", function(){
  var parent_id = $(this).find(".parent").val();
  var employee = $(this).find(".employeeId").val();
});

Note :

$(this) is current element that trigered by onClick event so $(this).find(".parent") means find element with class "parent" inside trigerred element

adam
  • 347
  • 2
  • 7
  • Please add some explanation to your answer such that others can learn from it – Nico Haase Sep 27 '21 at 10:07
  • What I have found that I was using var employee = $("#employeeId").val(); for getting value but var employee = $(this).find(".employeeId").val(); is the helpful for getting accurate values. ID OR class doesn't matter. I have checked it with both ID and Class, both are working fine. – Imran Shahzad Sep 27 '21 at 10:20
  • Yeah you're right if only to get the value but that's a bad practice [Can multiple element have same id](https://stackoverflow.com/questions/5611963/can-multiple-different-html-elements-have-the-same-id-if-theyre-different-eleme) However with class you can do better with the code – adam Sep 27 '21 at 11:56
  • @NicoHaase I have updated my answer with little explanation – adam Sep 27 '21 at 12:35