Question

我有一个HTML界面，在单击搜索按钮时会显示一个对话框。该对话框有一个文本字段，用户在其中键入搜索字符串，并通过Ajax系统使用PHP文件从数据库中获取数据并返回表格的数据通知

//code for dialog
    <script>
$(function() {
   $( ".comment").click(function(){ 
       $( "#dialog-modal" ).dialog({
          height: 140,
          modal: true,
          width : 440
        });
       $( "#dialog-modal" ).show();
    });
 });
</script>


<div class="inner2">
   <p><button class="more comment " type='button' ></button></p>

   <div id="dialog-modal" style="display:none">
    <input name="searchPat" id="searchPat" type="text" onkeyup="searchPatient(this.value)"  /> <input type="submit" id="submit" name="submit" value="Register Patient" /><br />
    <div id="newtable" >
    </div>
   </div>
 </div>

//searchPatient function
   <script>
     function searchPatient(str) {
       var xhttp;
       if (str.length < 3) { 
          return;
       }
       xhttp = new XMLHttpRequest();
       xhttp.onreadystatechange = function() {
       if (xhttp.readyState == 4 && xhttp.status == 200) {
         document.getElementById("newtable").innerHTML = xhttp.responseText;
        }
       };
       xhttp.open("GET", "/clinicosight/lib/getPatient.php?q="+str, true);
       xhttp.send(); 

      }

    </script>

//getPatient.php
            $pat_no = $_REQUEST["q"];
            $name="";

            $query = "select patient_no, surname || ' ' || other_name as name,residence,year_of_birth from hp_outpatient_register where patient_no ilike '%$pat_no%' ";
            $con = @pg_connect("host=$serverIP dbname=$database user=$username password=$password");
            $result = pg_query($con, $query);

            $tab="";
            if ($result) {
                //$tab=$tab. "";
                 $tab=$tab. "<table border ='1' width='30%' id='searchtable' style='cursor: pointer;' > <tr>";

                if (pg_num_rows($result) > 0) {
                    //loop thru the field names to print the correct headers
                    $i = 0;
                    while ($i < pg_num_fields($result)) {
                        $tab=$tab. "<th>" . pg_field_name($result, $i) . "</th>";
                        $i++;
                    }
                    $tab=$tab. "</tr>";

                    //display the data
                    while ($rows = pg_fetch_row($result)) {
                        $tab=$tab. "<tr>";
                        foreach ($rows as $data) {
                            $tab=$tab. "<td align='center'>" . $data . "</td>";
                        }
                        $tab=$tab. "</tr>";
                    }

                }
                $tab=$tab. "</table>";
            }
            echo $tab;


 //code for table listener
<script>
var table = document.getElementById("searchtable");
   //alert("People");
    if (table != null) {
        for (var i = 0; i < table.rows.length; i++) {
            for (var j = 0; j < table.rows[i].cells.length; j++)
            table.rows[i].cells[j].onclick = function () {
                tableText(this);
            };
        }
    }


function tableText(tableCell) {
    alert(tableCell.innerHTML);
}

 </script>

到目前为止，对话框可以显示，一旦用户在搜索文本字段中键入文本，就会从对话框中显示的getPatient.php创建一个动态表。问题是创建的表不响应表的onclick事件。请帮助解决问题，或者告诉我是否有遗漏的事情。

将事件侦听器注册到已通过AJAX动态创建的表上

0 个答案: