选择下拉列表值后,从数据库中检索数据并在php中的文本框中显示

时间:2014-04-22 07:51:29

标签: javascript php jquery ajax json

我正在尝试从尊重的文本框中的下拉列表中选择产品后获取产品的价格。所以请帮助我。!

因此,当产品从下拉列表中选择时,其价格应显示在resp文本框中。那么如何在文本框中显示该价格.......... 我的代码如下: -

<?php include_once("head.php"); ?>

<link rel="stylesheet" type="text/css" href="css/default.css"/>
<script type="text/javascript" src="js/script.js"></script>
<script>
    function showUser(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", "getCustomer.php?q=" + str, true);
        xmlhttp.send();
    }

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

    function demo(rValue) {
        debugger;
        $rValue = "";
        $query = ("SELECT city FROM customer where id=" + rValue);
        $result = mysql_query($query);
        if ($row = mysql_fetch_array($result)) {
            $rValue = $row['city'];
        }
        return $rValue;
    }
</script>
<!--BEGIN MASKED INPUTS-->
<form action="process.php" class="register" method="POST">
    <div class="tab-content">
        <div class="tab-pane active" id="glyphicon">
            <div class="box">
                <header>
                    <div class="icons">
                        <i class="fa fa-share"></i>
                    </div>
                    <h4 style="padding-left:200px;"> Bill Generation Form </h4>
                </header>
            </div>
        </div>
    </div>
    <fieldset class="row1">
        <legend>Customer Information</legend>
        <p>
            <label>Customer Name * </label>

            <?php
            include_once("db.php");
            $data = mysql_query("select * from customer");
            while ($row = mysql_fetch_array($data)) {
                $id = $row['id'];
                $options .= "<option value=$id>" . $row['name'] . "</option>";
            }
            $menu = "<select name='cust_name' id='cust_name' class='selct_list'         onchange=showUser(this.value);demo(this.value)>" . $options . "</select>";
            echo $menu;
            ?>
        </p>

    <br>

    <div id="txtHint"><b>Person info will be listed here.</b></div>
    <br><br>
    <br>

    <div class="clear"></div>
    </fieldset>
    <legend>Products Details</legend>
    <table id="dataTable" class="form" border="1">
        <tbody>
        <tr><p>
            <td><input type="checkbox" required="required" name="chk[]" checked="checked"/></td>
            <td><label>Product Name</label>

                <?php
                include_once("db.php");
                $datas = mysql_query("select * from inventory");
                $options .= "<option value=''> select product </option>";
                while ($rows = mysql_fetch_array($datas)) {
                    $ids = $rows['id'];
                    $options .= "<option value= $ids>" . $rows['item'] . "</option>";
                }
                $menus = "<select name='BX_NAME[]' id='BX_NAME[]' class='selct_list' onchange=showProduct(this.value)>" . $options . "</select>";
                echo $menus;

                ?> 
            </td>
            <td>
                <label for="BX_age">Qty</label>
                <input type="text" required="required" class="small" name="BX_age[]" value="<?php ?>"></td>

            <td><label for="BX_gender">Tax %</label>
                <input type="text" id="BX_gender" required="required" class="small" name="BX_gender[]"></td>

            <td><label for="BX_birth">Unite Price</label>
                <input type="text" id="BX_birth" required="required" name="BX_birth[]"></td>
            </p>
        </tr>
        </tbody>
    </table>
    <div class="clear"></div>
    <br>

    <p>
        <input type="button" value="Add New Row" onClick="addRow('dataTable')" class="btn btn-success btn-sm btn-line"/>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input type="button" value="Remove Selected Row" onClick="deleteRow('dataTable')"
               class="btn btn-warning btn-sm btn-line"/>

    <p>(All acions apply only to entries with check marked check boxes only.)</p>
    </p>

    <legend>Invoice Preference</legend>
    <p><label for="BX_gender">Select Invoice Preference</label>
        <select id="invoice" name="invoice" required="required">
            <option>....</option>
            <option>Invoice</option>
            <option>Quate</option>
            <option>Receipt</option>
        </select> </legend>

    <br>

    <div id="txtHint"><b>Person info will be listed here.</b></div>
    <br><br>

    <br>
    <input class="submit" type="submit" value="Confirm &raquo;"/>

    <div class="clear"></div>
    <div class="clear"></div>
</form>

2 个答案:

答案 0 :(得分:0)

首先,您必须将value属性赋予<option>标记,然后您必须在下拉列表的onchange事件中调用javascript函数。 2)在那个javascript函数中,输入代码 下拉选项值,已选中,然后使用javascript代码document.getElementById('your field id wher you want to show your value').value = your dropdownvalue;

答案 1 :(得分:0)

我没有阅读您的代码,但我认为您要求的是:

    if ($("#SELECT").val() === "ProductX") {
    $("#TEXTINPUT").val(PRICE);
}

当然将它包装成一个改变函数 $('#SELECT')。change(function(){ }

我建议使用JQuery,否则只需使用js命令

干杯