得到查詢結果顯示在表中

我在計算如何在表中顯示查詢結果時遇到了問題。 html表單有一個允許選擇機構名稱的下拉菜單。該表應顯示屬於該機構的人員。當我通過提交按鈕執行代碼時，pgsql的查詢結果顯示在php頁面上。 Json基本顯示。我應該將查詢的結果顯示在應該出現在html頁面的表格中。我被告知使用ajaxsubmit（），但我不確定如何修改下面的代碼。幫助將不勝感激。謝謝。得到查詢結果顯示在表中

<html> 
<head> 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" /> 

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> 
<script> 
$(document).ready(function(){ 

    ////////////////////////////////////// 
    // Displays insitution names in Drop Down Menu 

     //Getting the selector and running the code when clicked 
     $('#selinstit').click(function(e){ 
       //Getting the JSON object, after it arrives the code inside 
       //function(dataI) is run, dataI is the recieved object 
       $.getJSON('http://localhost/listinstitutions.php',function(dataI){ 
          //loop row by row in the json, key is an index and val the row 
          var items = []; //array 
          $.each(dataI, function(key, val) { 
          //add institution name to <option> 
          items.push('<option>' + val['Iname'] + '</option>'); 
         });//end each 
         //concatenate all html 
         htmlStr=items.join(''); 
         console.log(htmlStr); 
         //append code 
         $('option#in').after(htmlStr); 
       });//end getJSON 
     });//end cluck 


    /////////////////////////////// 
    // Displays persons form an institution in a table 

    $("$subinst").button().click(function(event) { 
    //console.log($(this)); // for Firebug  
    $.getJSON('http://localhost/SelectPersonsBasedOnInstitution.php',function(data){ // I make an AJAX call here 
    //console.log($(this)[0].url); // for Firebug check what url I get here 
          //loop row by row in the json, key is an index and val the row 
          var items = []; //array 
          $.each(data, function(key, val) { 

         //add table rows 
          items.push('<tr border=1><td>' + val['Pfirstname'] + '</td><td>' + val['Plastname'] + '</td><td><a mailto:=" ' + val['Pemail'] + ' " >' + val['Pemail'] + '</a></td></tr>'); 
         });//end each 
         //concatenate all html 
        htmlStr=items.join(''); 

         //append code 
         $('#instito').after(htmlStr); 
       });//end getJSON 
     event.preventDefault(); 
     }); 


    //// to send query to php file: for slect institution 
    $("#subinst").click(function() { 

    var url = "http://localhost/SelectPersonsBasedOnInstitution.php"; // the script where you handle the form input. 

    $.ajax({ 
      type: "POST", 
      url: url, 
      data: $("#myForm").serialize(), // serializes the form's elements. 
      success: function(data) 
      { 
       alert(data); // show response from the php script. 
      } 
     }); 

    return false; // avoid to execute the actual submit of the form. 
    }); 



}); //end ready 

</script> 

</head> 

<body> 

<form id="myForm" action="SelectPersonsBasedOnInstitution.php" method="post"> 
Select persons from an institution: 
<br>            
<tr> 
<td> 
    <select id="selinstit" name="instit"> 
    <option id="in">Select</option>      
    </select> 
</td> 
<td> 
    <input type="submit" id="subinst" value="Submit" /> 
</td> 
</tr> 

</form> 

    <table frame="border" id="instito"> 
    </table> 

</body> 
</html>

爲SelectPersonsBasedOnInstitution.php

<?php 


////////// 
// part 1: get information from the html form 
ini_set('display_errors', 1);          
ini_set('display_startup_errors', 1); 

foreach ($_REQUEST as $key => $value){ 
$$key=$value; 
} 

// part2: prepare SQL query from input 
$sqlquery= sprintf('SELECT "Pfirstname", "Plastname", "Pemail" FROM "PERSON" 
LEFT JOIN "INSTITUTION" ON 
"PERSON"."Pinstitution"="INSTITUTION"."Iinstitution" 
WHERE "Iname" = \'%s\'',$instit); 
//echo $sqlquery; 


///////// 
// part3: send query 
$dbh = pg_connect("host=localhost dbname=mydv user=***password=***"); 
$sql= $sqlquery; 
$result = pg_query($dbh,$sql); 
$myarray = pg_fetch_all($result); 

$jsontext = json_encode($myarray); 
echo($jsontext); 

?>

來源

2013-03-28 bmo

您可以簡單地使用'$ .getJSON（'/ listinstitutions.php'...' – hjpotter92 2013-03-28 08:24:54

是的確，但這並不能解決我的問題，雖然.Thx。 – bmo 2013-03-28 08:31:55

您的PHP代碼是否可以在不涉及Ajax （$ key = $ value）？ – bestprogrammerintheworld 2013-03-28 08:34:48

PHP代碼，我想你應該嘗試append而非after，試試吧。

編輯

請使用下面的函數

var htmlStr = ""; //to store html 
$(document).ready(function(){ 
    //// to send query to php file: for slect institution 
     $("#subinst").click(function(event) { 

     var url = "http://localhost/SelectPersonsBasedOnInstitution.php"; // the script where you handle the form input. 

     $.ajax({ 
       type: "POST", 
       url: url, 
       data: $("#myForm").serialize(), // serializes the form's elements. 
       success: function(data) 
       { 
        //alert(data); // show response from the php script. 
        var json_data = $.parseJSON(data); 
        var items = []; //array 
           $.each(json_data, function(key, val) { 

          //add table rows 
           items.push('<tr border=1><td>' + json_data[key].Pfirstname + '</td><td>' + json_data[key].Plastname + '</td><td><a mailto:=" ' + json_data[key].Pemail + ' " >' + json_data[key].Pemail + '</a></td></tr>'); 
          });//end each 
          //concatenate all html 
         htmlStr=items.join(''); 

          //append code 
          $('#instito').append(htmlStr); 
       } 
      }); 

     event.preventDefault(); // avoid to execute the actual submit of the form. 
     }); 

});//ready()

，我想你可以從你的腳本刪除事件處理程序$("#subinst").button().click(function(event) {。

來源

2013-03-28 08:29:22

謝謝你，我試過了，得到了同樣的結果：th e php頁面被加載，並顯示JSON。 – bmo 2013-03-28 08:44:06

做了一些進步：Firebug指出了一個bug：我替換了$（「$ subinst」）.button（）。click（function（event）{by $（「#subinst」）.button（）。click（function（event） {。現在我的查詢結果顯示在警告消息中，php不再被加載，事實上我的代碼中聲明瞭警報消息（參見上文）。我怎樣才能將查詢結果直接導入到表中？ – bmo 2013-03-28 08:58:24

@ user2215691 – 2013-03-28 09:22:34

得到查詢結果顯示在表中

回答

相關問題