来自不同表的数据使用ajax和datepicker

时间:2016-08-02 13:31:51

标签: php mysql ajax

朋友们,我是使用ajax从数据库中获取数据。

问题是,我在选择日期时使用html的日期选择器我得到了账单ID作为按钮,现在问题是整个事情是使用ajax完成的。点击按钮我想获得订单详细信息,但在同一页面上,我该怎么做。

这是代码。

oldbills.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function get(str)
{
    //document.write("hi");
var xmlhttp;
if (str==0)
  { 
 alert("please select Table no");
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    //  var dat=xmlhttp.responseText;
    //document.write(dat[0]);
    document.getElementById("showresult").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","fetchbills.php?dt="+str,true);
xmlhttp.send();
}
</script>
</head>

<body>
<input type="date" name="datepicker" id="picker" onchange="get(this.value)"/>
<div id="showresult">

</div>
</body>
</html>

从fetchbills.php获取数据 fetchbills.php

<?php
include("./config.php");
$dt = $_REQUEST["dt"];
echo "<script type='text/javascript'>
function get(str)
{
var xmlhttp;
if (str==0)
  { 
 alert('please select Table no');
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject('Microsoft.XMLHTTP');
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    //  var dat=xmlhttp.responseText;
    //document.write(dat[0]);
    document.getElementById('showresult').innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open('POST','fetchbilldetail.php',true);
xmlhttp.send();
}
</script>";
//echo $dt;
$sql="select bill_id,order_id from bill_master where order_date='$dt'";
//echo $sql;
$result=mysqli_query($con,$sql) or die("error");
//echo "<table><tr><th>Item Name</th><th>Quantity</th></tr>";
if($result)
{
while($row=mysqli_fetch_array($result))
{
    //echo "1";
echo $row[0]."<br>";    
echo "<form method='post' action=''><input type='submit' name='det' value='".$row[1]."' onclick='get(this.value)' /></form>
<div id='showresult'></div>";
//  echo "<tr><td>".$row[4]."</td><td>".$row[3]."</td></tr>";
}
}
//echo "</table>";
?>

我以为我也可以在这个页面中使用ajax并从3页获取数据并在1页上显示。

但链接被重定向,数据显示在3页上。

fetchbilldetail.php

<?php
include("./config.php");
$det = $_POST["det"];
//echo $det;
$sql="SELECT m.old_order_id,m.old_order_amount,l.item_id,l.old_order_quantity,i.item_name from old_order_master m,old_order_list l,item_list i where m.old_order_id=$det and m.old_order_id=l.old_order_id and l.item_id=i.item_id";
//echo $sql;
$result=mysqli_query($con,$sql);
echo "<table><tr><th>Item Name</th><th>Quantity</th></tr>";
while($row=mysqli_fetch_array($result))
{

    echo "<tr><td>".$row[4]."</td><td>".$row[3]."</td></tr>";
}
echo "</table>";
?>

如何在单页上获取数据。

2 个答案:

答案 0 :(得分:0)

我刚刚尝试了ajax演示。但我想知道如何获得另一个数据。

这是我从php页面获取数据的代码。

oldbills.php

In [1172]: ind=np.cumsum([2,1,3,4])-1
In [1173]: ind
Out[1173]: array([1, 2, 5, 9], dtype=int32)
In [1174]: np.take(a1,ind,axis=1)
Out[1174]: 
array([[2, 1, 1, 3],
       [3, 3, 2, 1]])

fetchbills.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

</head>

<body>
<form method="post">
         <input type="date" name="gdate" id="gdate" onchange="<?php echo $_SERVER['PHP_SELF']?>"/>
      </form>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 <script>
 function makeAjaxRequest(dateval){
        $.ajax({
          type: "GET",
          data: { dateva: dateval }, 
          url: "fetchbills.php",
          success: function(data) {
           $('#showresult').html(data);
          }
        });
      }

 $("#gdate").on("change", function(){
        var id = $(this).val();
          makeAjaxRequest(id);

      });
 </script>
<div id="showresult">

</div>
</body>
</html>

enter image description here

这些按钮是从php获取的数据,现在单击这些按钮我想从表中获取数据。我是否这样做。

答案 1 :(得分:0)

那很好......你正在获取按钮,因为输出现在没有写按钮onclick属性

fetchbills.php 中就是这样:

echo "<form method='post' action=''><input type='submit' name='det' value='".$row[1]." id='det'/></form>";

现在在js文件中将代码写为

$(document).on('click','#det',function(){
    $.ajax({
          type: "GET",
          data: { //your button id to be pass in the data  }, 
          url: "yourUrl.php",
          success: function(data) {
             $('resultID').html(data);
          }
        });
});

并在yourUrl.php中 编写代码以根据您发送的ID获取帐单详细信息。 所以,你会得到你想要的结果.. 它的ajax呼叫2次。第一个用于获取按钮,另一个用于获取提单。 享受