PHP适用于HTML,但不适用于jquery

时间:2015-10-28 05:55:16

标签: javascript php jquery html mysql

我想用jquery来调用php在同一页面上显示数据。但是,如果我使用jquery来调用数据,我会继续得到" 0结果"但是当我使用提交按钮时,我在.php窗口中获得了正确的数据...感谢任何帮助!谢谢!

哦,我在不同的文件中有三个脚本但是在html文件中将jquery链接在头部。提前谢谢!

HTML

<form method="post" action="contract.php">
 <fieldset>
    <div class="wrap_21">
      <fieldset id="accountnumber">
               <input type="text" name="accountnumber" placeholder="Account Number" value="" required style="width:240px; height:24px"/>
      </fieldset>
    </div>
    <div class="wrap_16">
              <fieldset id="tradetype">
                   <span class="text_9">TRADE:</span>
                   <span class="text_11">
                   <input type="radio" name="tradetype" required value="Buy"/> Buy
                   <input type="radio" name="tradetype" value="Sell"/> Sell </span>
              </fieldset>
              <fieldset>
                  <span class="text_9">PRICE:</span>
                  <span class="text_11">
                  <input type="text" name="price" value="" required /></span>
              </fieldset>
              <fieldset>
                  <span class="text_9">DATE:</span>
                  <select name="date" id="date" onchange="showData(this.Value)">
                      <option value="">Select</option>
                      <option value="24 November 2015">24-Nov-15</option>
                      <option value="24 December 2015">24-Dec-15</option>
                      <option value="24 January 2015">24-Jan-15</option>
                  </select>
              </fieldset>
          <input type="submit" name="formSubmit" value="Submit">
 </fieldset>



PHP

    <?php
  $servername = "localhost";
  $username = "";
  $password = "";
  $dbname = "";

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
     die("Connection failed: ". $conn->connect_error);
}

$tradetype=$_POST['tradetype'];
$price=$_POST['price'];
$date=$_POST['date'];

$sql = "SELECT * FROM Contracts WHERE Trade='$tradetype' AND ExpiryDate='$date'";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    //output data of each row
    while($row = $result->fetch_assoc()) {
        echo "Premium: " . $row["Premium"]. " Discount: " . $row["Discount"] . "<br>";
    }
} else {
    echo "0 results";
}

$conn->close();
?>

Jquery的

    function showData(str) {
  if (str=="") {
    document.getElementById("txtHint").innerHTML="";
    return;
  } 
  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) {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","contract.php?q="+str,true);
  xmlhttp.send();
}

4 个答案:

答案 0 :(得分:1)

这是你的问题:showData(this.Value),在你的php中你有3个帖子变量只发送一个

尝试这样的事情:

从选择

中删除onchange="showData(this.Value)
$('select[name="date"]').on('change',function(e){
  e.preventDefault();
  var parent = $(this).parents('form');
  $.ajax({url: "contract.php",
   type:"POST",
   data:{
       'tradetype':parent.find('input[name="tradetype"]').val(),
       'price':parent.find('input[name="price"]').val(),
       'date':parent.find('option:selected').val()
   },
  success: function(result) {
    $("#result").html(result);
}});

答案 1 :(得分:1)

完整的HTML代码: -

<form method="get" id="formpge" action="">
 <fieldset>
    <div class="wrap_21">
      <fieldset id="accountnumber">
               <input type="text" name="accountnumber" id="accountnumber" placeholder="Account Number" value="" required style="width:240px; height:24px"/>
      </fieldset>
    </div>
    <div class="wrap_16">
              <fieldset id="tradetype">
                   <span class="text_9">TRADE:</span>
                   <span class="text_11">
                   <input type="radio" name="tradetype" id="tradetype" required value="Buy"/> Buy
                   <input type="radio" name="tradetype" id="tradetype" value="Sell"/> Sell </span>
              </fieldset>
              <fieldset>
                  <span class="text_9">PRICE:</span>
                  <span class="text_11">
                  <input type="text" name="price" id="price" value="" required /></span>
              </fieldset>
              <fieldset>
                  <span class="text_9">DATE:</span>
                  <select name="date" id="date" >
                      <option value="">Select</option>
                      <option value="24 November 2015">24-Nov-15</option>
                      <option value="24 December 2015">24-Dec-15</option>
                      <option value="24 January 2015">24-Jan-15</option>
                  </select>
              </fieldset>
          <input type="button" name="formSubmit" id="formSubmit" value="Submit">
          <div id="result"></div>
 </fieldset>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
  $(document).ready(function(){ //newly added 

      $( "#date" ).change(function() {

        event.preventDefault();

            var data = $( "#formpge" ).serialize();
            var url = 'contract.php?'+data;
              $.get( , function( data ) {
                $( "#result" ).html( data );

            });

      });
  });
  </script>
你的php中的

将$ _POST更改为$ _GET;

答案 2 :(得分:0)

你没有通过

贸易类型,价格,日期;请求中的参数

所以试试

function showData(str) {
   var data={
       tradetype :$('#tradetype').val(),
       price:$('#price').val(),
       date:$('#date').val()
  };
  if (str=="") {
    document.getElementById("txtHint").innerHTML="";
    return;
  } 
  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) {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("POST","contract.php",true);
  xmlhttp.send(data);
}

答案 3 :(得分:-1)

您可以在这里获得详细的教程 -

http://www.a100websolutions.in/retrieve-data-using-jquery-php/

完整教程,演示如何在后端使用AJAX / JQuery和PHP从数据库获取数据。此外,代码在那里,所以你也可以参考代码。