如何使用jQuery弹出窗口在php中编辑记录

Question

I have the list of record i want to edit the record in popup when I click on the button of the record it is showing the 1st record in the popup not all the record i want to edit every record but it is not working

this is my php code

<?php

    error_reporting(0);
        $conn = mysql_connect('localhost', 'root', '') or die("Can't Connect With Local");
        $db = mysql_select_db('school') or die("Local DB Not Found");

        $s = mysql_query("Select * from student");

        while($sql = mysql_fetch_array($s))
        {
        echo'<div class="ammad">'. $sql["id"]."".$sql["Name"]."".$sql["Subject"].'</div>';
        echo '<input ammad="'.$sql["id"].'" type="submit" class="abc" id="abc"/>';

        }

?>

this is the popup html

<div id="myModal" class="modal">


<div class="modal-content">
    <span class="close">×</span>
    <p></p>
</div>

</div>

and this is the script of my popup

    <script>
    var modal = document.getElementById('myModal');
    var btn = document.getElementById('abc');
    var span = document.getElementsByClassName("close")[0];
    btn.onclick = function() {
        modal.style.display = "block";
    }
    span.onclick = function() {
        modal.style.display = "none";
    }
    window.onclick = function(event) {
        if (event.target == modal) {
            modal.style.display = "none";
        }
    }
    </script>


<script type="text/javascript">

$(document).ready(function(){

$("#abc").click(function(){
    var b = $(this).attr("ammad");
    $(".modal-content").append(b);

    });
});

</script>

Answer 1

You are using two scripts over same element

1. btn.onclick = function() {
2. $("#abc").click(function(){
   
   but both are same element and actions are same. Better use either one.
   Do not mixup basic javascript and jquery for simple stuffs. Use either one you are comfortable with.