2017-02-08 159 views
0

我通過在文本框中輸入來設置下拉值。問題是我的下拉值與下拉列表中的選項文本不同。所以我必須將每個選項的值輸入到文本中才能在下拉菜單中獲取正確的文本。如何通過在文本框中放置文本來選擇文本。如何使用jQuery設置選擇框的文本

$(document).ready(function(){ 
 
    $("#txt_scheme").keyup(function(){ 
 
    $("#scheme").val($("#txt_scheme").val()); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="form-group"> 
 
    <label class="col-sm-4 control-label">Scheme**</label> 
 
    <div class="col-sm-4"> 
 
    <select class="form-control" name="scheme" id="scheme"> 
 
     <?php 
 
     for ($column = 'A'; $column <= $lastcol; $column++) { 
 
      echo '<option value="' . $column . '">' . $worksheet->getCell($column . '1')->getValue() . '</option>'; 
 
     } 
 
     ?> 
 
    </select> 
 
    </div> 
 
    <div class="col-sm-4"> 
 
    <input type="text" class="form-control" id="txt_scheme" name="txt_scheme" placeholder="Or Type here"> 
 
    </div> 
 
</div>

我的下拉選項

QC code 
Analyte 
Assay Value 
Assigned Value 
STANDARDDEVIATION 
ACCEPTABLEMIN 
ACCEPTABLEMAX 
Sample ID 
Date 

有值是一樣QC碼字母有一個值。

因此,如果我在文本中輸入QC code,它應該從下拉列表中選擇QC code。現在即時得到它通過鍵入A

+1

請發佈呈現的HTML,而不是PHP。 – j08691

回答

1

你應該爲了獲得value使用filter功能

$(document).ready(function(){ 
    $("#txt_scheme").keyup(function(){ 
     var valueFromText=$("#scheme option").filter(function(i,option){ 
      return $(option).text()==$("#txt_scheme").val(); 
     }).val(); 
     $("#scheme").val(valueFromText); 
    }); 
}); 

$("#txt_scheme").keyup(function(){ 
 
     var valueFromText=$("#scheme option").filter(function(i,option){ 
 
      return $(option).text().toLowerCase()==$("#txt_scheme").val().toLowerCase(); 
 
     }).val(); 
 
     $("#scheme").val(valueFromText); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="scheme"> 
 
    <option value="A">QC code</option> 
 
    <option value="B">Analyte</option> 
 
    <option value="C">Assay Value </option> 
 
    <option value="D">Assigned Value </option> 
 
    <option value="E">STANDARDDEVIATION</option> 
 
    <option value="F">ACCEPTABLEMIN</option> 
 
    <option value="G">ACCEPTABLEMAX</option> 
 
    <option value="H">Sample ID</option> 
 
</select> 
 
<input type="text" id="txt_scheme"/>
:與 txt_scheme文本選項

+1

精美的工作!只有一件事是我可以寫成小寫的。我必須糾正輸入所有文字。? –

+1

@adeel,是的,可以使用'toLowerString()'方法。我更新了我的答案。 –

+0

@ Alexandru-Ionut Mihai做得非常好! thankx爲我提供了一個快速解決方案,搜索5小時,但我沒有得到正確的答案。可能並未通過適當的關鍵字進行搜索。 –

0

使用contains()抓住它的文本值的選擇選項,然後將其selected屬性爲true:

var textValue = $("#txt_scheme").val(); 
$("select option:contains("+textValue+")").attr('selected', true); 
+0

對不起,我沒有得到你的答案。你能不能簡單地給我打電話 –

相關問題