无法将ajax填充的字段传递给php

时间:2011-11-17 17:25:50

标签: php javascript ajax

您好我有一个使用ajax来显示产品/商品信息的字段

<input type="text" size="30" id="sku" />
<input type="button" name="Button" class="button" 
id="submit_btn" value="Search" onClick="showResult(sku.value)" />

js功能:

function showResult(str)
{
if (str=="")
  {
  document.getElementById("description").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("description").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getitem.php?sku="+str,true);
xmlhttp.send(null);

这很好用并正确输出所需的数据。然而,当我尝试提交表单并捕获输入的sku号并回显它时,我得到了“资源ID#5”,这是我以前从未见过的。

这是php:

$sku = $_POST['sku'];
$con = mysql_connect('localhost', 'root', '');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("test", $con);

$itemPrice = mysql_query("SELECT price FROM user WHERE sku = '.$sku.'");
<html>
<body>
<p><?php echo $itemPrice ?></p>
</body>
</html>

基本上我要做的是将sku编号输入字段“sku”并将其发布到变量并在提交表单后回显它。

提前致谢

编辑:

HTML:

<script type="text/javascript">

function showResult(str)
{
if (str=="")
  {
  document.getElementById("description").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("description").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getuser.php?sku="+str,true);
xmlhttp.send(null);
}
</script>
</head>
<body id="main_body" >

    <img id="top" src="top.png" alt="">
    <div id="form_container">
    <h1><a>Checkout</a></h1>
<form id="customForm" class="appnitro"  method="post" action="payment.php">
                    <div class="form_description">
            <h2>Checkout</h2>
            <p>Please fill in all fields to ensure your purchase is processed as quickly as possible. If you have any questions or concerns please contact us at support</p>
        </div>      
        <input type="text" size="30" id="sku" />
<input type="button" name="Button" class="button" id="submit_btn" value="Search" onClick="showResult(sku.value)" />
<br />
<div id="description"></div>
            <ul >
                    <li id="li_11" >
        <label class="description" for="element_11">Voucher/Coupon Number </label>
        <div>
            <input id="voucher_number" name="voucher_number" class="element text medium" type="text" maxlength="255" value=""/> 
        </div><p class="guidelines" id="guide_voucher_number"><small>Please enter the voucher/coupon number received at the time of purchase</small></p> 
        </li>       <li id="li_4" >
        <div><label class="description" for="bill_name">Name </label>
        <span>
            <input id="bill_first" name= "bill_first" class="element text" maxlength="15" size="8" value=""/>
            <label>First</label>
        </span>
        <span>
            <input id="bill_middle" name= "bill_middle" class="element text" maxlength="15" size="5" value=""/>
            <label>Middle</label>
        </span>
        <span>
            <input id="bill_last" name= "bill_last" class="element text" maxlength="15" size="8" value=""/>
            <label>Last</label>
        </span>
        <div id="nameInfo"></div></div>
        <p class="guidelines" id="guide_19"><small>Please enter your name as it appears on your credit card</small></p>
        </li>       <li id="li_1" >
        <label class="description" for="element_1">Phone </label>
        <span>
            <input id="bill_area" name="bill_area" class="element text" size="3" maxlength="3" value="" type="text"> -
            <label for="bill_area">(###)</label>
        </span>
        <span>
            <input id="bill_fnum" name="bill_fnum" class="element text" size="3" maxlength="3" value="" type="text"> -
            <label for="bill_fnum">###</label>
        </span>
        <span>
            <input id="bill_lnum" name="bill_lnum" class="element text" size="4" maxlength="4" value="" type="text">
            <label for="bill_lnum">####</label>
        </span>

        </li>       <li id="li_2" >
        <label class="description" for="email">Email</label>
        <div>
            <input id="email" name="email" class="element text medium" type="text" maxlength="35"/>
          <div class="error" id="emailInfo"></div>
          <p class="guidelines" id="guide_14"><small>Please enter your email address. This email will be used for all future communications between Overstock-King.com and yourself</small></p>
            </div>
        </li>       <li id="li_3" >
        <label class="description" for="element_3">Billing Address </label>

        <div>
            <input id="bill_street" name="bill_street" class="element text large" value="" type="text">
            <label for="bill_street">Street Address</label>
        </div>

        <div>
            <input id="bill_street_2" name="bill_street_2" class="element text large" value="" type="text">
            <label for="bill_street_2">Address Line 2</label>
        </div>

        <div class="left">
            <input id="bill_city" name="bill_city" class="element text medium" value="" type="text">
            <label for="bill_city">City</label>
        </div>

        <div class="right">
            <select class="element select medium" input id="bill_province" name="bill_province">
            <option value="" selected="selected"></option>
            <option value="bc">British Columbia</option>
            <option value="alb">Alberta</option>
            <option value="sas">Saskatchewan</option>
            <option value="man">Manitoba</option>
            <option value="ont">Ontario</option>
            <option value="que">Quebec</option>
            <option value="nfl">Newfoundland & Labrador</option>
            <option value="nov">Nova Scotia</option>
            <option value="nwb">New Brunswick</option>
            <option value="pei">Prince Edward Island</option>
            <option value="ykn">Yukon</option>
            <option value="nwt">Northwest Territories</option>
            <option value="nun">Nunavut</option>
            </select>
            <label for="bill_province">Province</label>
        </div>

        <div class="left">
            <input id="bill_postal" name="bill_postal" class="element text medium" maxlength="6" value="" type="text">
            <label for="bill_postal">Postal Code</label>
    </div><p class="guidelines" id="guide_3"><small>Please enter the address that is on your credit card</small></p> 
        </li>       <li class="section_break">
      <h3>Shipping Information</h3>
            <p></p>
        </li>       <li id="li_6" >
        <label class="description" for="ship_name">Name </label>
        <span>
            <input id="ship_first" name= "ship-first" class="element text" maxlength="15" size="8" value=""/>
            <label>First</label>
        </span>
        <span>
            <input id="ship_first" name= "ship-first" class="element text" maxlength="15" size="5" value=""/>
            <label>Middle</label>
        </span>
        <span>
            <input id="ship_last" name= "ship_last" class="element text" maxlength="15" size="8" value=""/>
            <label>Last</label>
        </span> <p class="guidelines" id="guide_11"><small>Please enter the person you want the product shipped to</small></p>
        </li>       <li id="li_7" >
        <label class="description" for="ship_address">Shipping Address </label>

        <div>
            <input id="ship_street" name="ship_street" class="element text large" value="" type="text">
            <label for="ship_street">Street Address</label>
        </div>

        <div>
            <input id="ship_street_2" name="ship_street_2" class="element text large" value="" type="text">
            <label for="ship_street_2">Address Line 2</label>
        </div>

        <div class="left">
            <input id="ship_city" name="ship_city" class="element text medium" value="" type="text">
            <label for="ship_city">City</label>
        </div>

        <div class="right">
            <select class="element select medium" input id="ship_province" name="ship_province" onchange="showTax(this.value)">
            <option value="" selected="selected"></option>
            <option value="bc">British Columbia</option>
            <option value="alb">Alberta</option>
            <option value="sas">Saskatchewan</option>
            <option value="man">Manitoba</option>
            <option value="ont">Ontario</option>
            <option value="que">Quebec</option>
            <option value="nfl">Newfoundland & Labrador</option>
            <option value="nov">Nova Scotia</option>
            <option value="nwb">New Brunswick</option>
            <option value="pei">Prince Edward Island</option>
            <option value="ykn">Yukon</option>
            <option value="nwt">Northwest Territories</option>
            <option value="nun">Nunavut</option>
            </select>
            <label for="ship_province">Province</label>
        </div>

        <div class="left">
            <input id="ship_postal" name="ship_postal" class="element text medium" maxlength="15" value="" type="text">
            <label for="ship_postal">Postal Code</label>
        </div><p class="guidelines" id="guide_7"><small>Please enter the address you want your product shipped to</small></p> 
        </li>   <div id="provinceInfo"></div><div id="streetInfo"></div>

                    <li class="buttons">
                <input type="hidden" name="form_id" value="288717" />

                <input id="submit_form" class="button_text" type="submit" name="submit" value="Submit" />
        </li>
            </ul>
        </form>
    </div>
    </div>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="validation.js"></script>
    <script type="text/javascript" src="view.js"></script>
</body>
</html>

validation.js:

$(document).ready(function(){
    //global vars
    var form = $("#customForm");
    var fname = $("#bill_first");
    var lname = $("#bill_last");
    var nameInfo = $("#nameInfo");
    var email = $("#email");
    var emailInfo = $("#emailInfo");
    var creditCard = $("#credit_card");
    var ccInfo = $("#ccInfo");
    var cvv = $("#security_code");
    var cvvInfo = $("#cvvInfo");
    var street = $("#ship_street");
    var province = $("#ship_province");
    var provinceInfo = $("#provinceInfo");
    var streetInfo = $("#streetInfo");
    var description = $("#description");

    //On blur
    fname.blur(validateFname);
    lname.blur(validateLname);
    email.blur(checkEmail);
    creditCard.blur(validateCreditcard);
    cvv.blur(validateCvv);
    street.blur(validateStreet);
    province.blur(validateProvince);
    description.click(showResult);
    //On Submitting
    form.submit(function(){
        if(validateFname() & checkEmail() & validateLname() & validateCreditcard() & validateCvv() & validateStreet() & validateProvince())
            return true
        else
            return false;
    });

    //validation functions
function checkEmail(){
    httpObject = getHTTPObject();
    if (httpObject != null) {
        if (!document.getElementById('email').value== ""){
            httpObject.open("GET", "validate_email.php?email="+document.getElementById('email').value, true);
            httpObject.send(null);
            httpObject.onreadystatechange = setImage;
        }
        else
        {
            document.getElementById('emailInfo').innerHTML = "Please enter a valid email address";
        }
    }
}
    function getHTTPObject(){
    if (window.ActiveXObject) return new ActiveXObject("Microsoft.XMLHTTP");
    else if (window.XMLHttpRequest) return new XMLHttpRequest();
    else {
    alert("Your browser does not support AJAX.");
    return null;
    }
    }

    function setImage(){
    if(httpObject.readyState == 4){document.getElementById('emailInfo').innerHTML = httpObject.responseText;}

    }

    function validateFname(){
        //if it's NOT valid
        if(fname.val().length < 1){
            fname.addClass("error");
            nameInfo.text("Please enter your first name");
            nameInfo.addClass("error");
            return false;
        }
        //if it's valid
        else{
            fname.removeClass("error");
            nameInfo.text("");
            nameInfo.removeClass("error");
            return true;
        }
    }
    function validateLname(){
        //if it's NOT valid
        if(lname.val().length < 1){
            lname.addClass("error");
            nameInfo.text("Please enter your last name");
            nameInfo.addClass("error");
            return false;
        }
        //if it's valid
        else{
            lname.removeClass("error");
            nameInfo.text("");
            nameInfo.removeClass("error");
            return true;
        }
    }
    function validateCreditcard(){
        //if it's NOT valid
        if(creditCard.val().length < 15){
            creditCard.addClass("error");
            ccInfo.text("Please enter your credit card number");
            ccInfo.addClass("error");
            return false;
        }
        //if it's valid
        else{
            creditCard.removeClass("error");
            ccInfo.text("");
            ccInfo.removeClass("error");
            return true;
        }
    }
    function validateCvv(){
        //if it's NOT valid
        if(cvv.val().length < 3){
            cvv.addClass("error");
            cvvInfo.text("Please enter your credit card security code");
            cvvInfo.addClass("error");
            return false;
        }
        //if it's valid
        else{
            cvv.removeClass("error");
            cvvInfo.text("");
            cvvInfo.removeClass("error");
            return true;
        }
    }
    function validateProvince(){
        //if it's NOT valid
        if(province.val().length < 2){
            province.addClass("error");
            provinceInfo.text("Please select the province you are shipping the product to");
            provinceInfo.addClass("error");
            return false;
        }
        //if it's valid
        else{
            province.removeClass("error");
            provinceInfo.text("");
            provinceInfo.removeClass("error");
            return true;
        }
    }
});

3 个答案:

答案 0 :(得分:2)

mysql_query()成功时总是返回resource

您只需要使用mysql_result()

获取结果

答案 1 :(得分:2)

您的字段<input type="text" id="sku" />缺少名称属性,在发布到服务器时使用名称属性,因此只需将其更正为

<input type="text" id="sku" name="sku" />

它会起作用

答案 2 :(得分:1)

更改$ sku = $ _POST ['sku']; $ sku = $ _GET ['sku'];

"SELECT price FROM user WHERE sku = '.$sku.'" "SELECT price FROM user WHERE sku = \''.$sku.'\'"

以表格形式:

<input type="text" size="30" id="sku" />

替换为

<input type="text" size="30" id="sku" name="sku" />