基于动态下拉框填充文本框

Question

我正在尝试基于从数据库填充的动态保管箱填充文本框。

我的代码如下：

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

        <?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'];
            }
    }

    ?>

我有什么

我想要什么：

在下拉列表中选择的特定部门的 ID 号应显示在文本框中。我还附上了我正在尝试做的事情的摘录

但它似乎不起作用。你觉得我哪里做错了？感谢任何帮助:)

Answer 1

FIDDLE

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

})

动态值

FIDDLE

使用.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'));

    })

假设我有来自 php 的数据，我将department name 设置为option name，并将department id 设置为data-id。然后从选择更改事件中，我将获得data-id 的值并将其设置为输入值。