2015-09-05 59 views
3

我想填充基于从数据库填充的动态Dropbox的文本框。基于动态下拉框填充文本框

我的代码如下:

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

    ?> 

我有什么

enter image description here

我想要什么:

是在下拉菜单选择向下应该在文本框中显示特定部门的ID号。我还附上了什么,我试图做

enter image description here

摘录但它似乎并没有工作。你认为我哪里出错了?感谢所有帮助:)

+0

每个'

+0

您需要使用JavaScript,才能在选择更改时设置#cur_code的值。我认为提出请求来获取每个ID是一个糟糕的主意,这只是一个数字,将其存储在选项的数据ID中。 –

回答

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并将其设置为输入的值。

+0

值不起作用,因为value是根据OP的代码的名称。他们想要在下一个字段中设置的是ID。 –

+0

它可能从填充选择他可以设置ID号作为选项的值从那里一切都会完美下降 – guradio

+0

更新第二个小提琴请给它一个镜头@RamtinGh – guradio