简体   繁体   English

根据动态下拉框填充文本框

[英]Populate a text box based on a dynamic drop down box

I am trying to populate a text box based on a dynamic dropbox that is populated from the database. 我正在尝试基于从数据库填充的动态保管箱填充文本框。

My Code is as Below : 我的代码如下:

index.php 的index.php

<?php
    include "../conn.php";
?>
<html>
    <head>
    <title>Changing textbox value based on dropdown list using Ajax and PHP</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script>
    function getXMLHTTP() { 
            var xmlhttp=false;  
            try{
                xmlhttp=new XMLHttpRequest();
            }
            catch(e)    {       
                try{            
                    xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch(e){
                    try{
                    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                    }
                    catch(e1){
                        xmlhttp=false;
                    }
                }
            }

            return xmlhttp;
        }



    function getCurrencyCode(strURL){       
        var req = getXMLHTTP();     
        if (req){
            //function to be called when state is changed
            req.onreadystatechange = function(){
                //when state is completed i.e 4
                if (req.readyState == 4) {          
                    // only if http status is "OK"
                    if (req.status == 200){                     
                        document.getElementById('cur_code').value=req.responseText;                     
                    } else {
                        alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }           
    }
    </script>
    </head>

    <body style="font: 12px Verdana, Arial, Helvetica, sans-serif;">

    <form style="text-align:center" method="post" action="" name="form1">
    <p style="color:#000099 ">When you change the dropdown list, the respective currency code of the country will be displayed in the textbox which is fetched from PHP using Ajax. </p>
    <p>Department :                             <?PHP
                                    echo "<select name= 'Department' class='form-control selectpicker' onChange='getCurrencyCode('find_ccode.php?country='+this.value)' Required>";
                                    echo '<option value="">'.'--Please Select Department--'.'</option>';
                                    $sql = "SELECT ID,Name FROM Departments";
                                    $query = sqlsrv_query($conn,$sql);
                                    $query_display = sqlsrv_query($conn,$sql);
                                    while($row=sqlsrv_fetch_array($query_display,SQLSRV_FETCH_ASSOC)){
                                    echo "<option value='". $row['Name']."'>".$row['Name']. '</option>';
                                    }
                                    echo "</select>";
                                ?>
    ID :   <input type="text" name="cur_code" id="cur_code" ></p>
    </form>
    </body>
</html>

find_ccode.php find_ccode.php

        <?php 

    $country=$_REQUEST['country'];
    include '../conn.php';

    $sql = "SELECT ID,Name FROM Departments Name='$country'";
            $fetched=sqlsrv_query($conn,$sql) ; 
        if( $fetched === false ) { die( print_r( sqlsrv_errors(), true ));}
            while($sno=sqlsrv_fetch_array($fetched,SQLSRV_FETCH_ASSOC))
            {
                echo $formno=$sno['ID'];
            }
    }

    ?>

What I have 我有的

在此输入图像描述

What I want : 我想要的是 :

The ID number of that particular department that is selected in the drop down should display in the text box. 在下拉列表中选择的特定部门的ID号应显示在文本框中。 I have also attached an extract of what I am trying to do 我还附上了我想要做的一些摘录

在此输入图像描述

But it doesn't seem to work. 但它似乎没有用。 Where do you think I have gone wrong? 你认为我哪里出错了? Appreciate any help :) 感谢任何帮助:)

FIDDLE 小提琴

$('#sel').change(function() {
    $('#qwe1').val($('#sel option:selected').val());

})

for dynamic value 为了动态价值

FIDDLE 小提琴

Use .change to select and get its value then put it to input box. 使用.change选择并获取其值,然后将其放入输入框。

UPDATE

FIDDLE 小提琴

var data = var data = [{
    "id": "342-432-423-000","name": "name1"
}, {
    "id": "342-432-423-001","name": "name2"
}, {
    "id": "342-432-423-002","name": "name3"
}, {
    "id": "342-432-423-003","name": "name4"
}, {
    "id": "342-432-423-004","name": "name5"
}, {
    "id": "342-432-423-005","name": "name6"
}, {
    "id": "342-432-423-006","name": "name7"
}, {
    "id": "342-432-423-007","name": "name8"
}]


for (var i = 0; i < data.length; i++) {
        $('#sel').append('<option id=' + data[i].id + ' data-id="' + data[i].id + '">' + data[i].name + '</option>');
    }

    $('#sel').change(function () {
        $('#qwe1').val($('#sel option:selected').data('id'));

    })

Assuming I have the data from php I set the department name as option name and I set the department id as data-id . 假设我有来自php的数据,我将department name设置为option name ,并将department id设置为data-id Then from select change event i will get the value of data-id and set it as value of the input. 然后从select change事件中我将获得data-id的值并将其设置为输入的值。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM