2015-09-05 88 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