选择>选择>文本框(类别>项目>项目说明)

时间:2014-06-05 18:48:28

标签: javascript select drop-down-menu onchange

我正在尝试使用2个选择标签和1个输入(文本)

来实现某些功能

我有1个选择标记:类别 我有1个选择标签:项目 我有1个输入标签:项目描述

它们应该是动态的,因此项目描述仅显示Item中的值,而Item仅显示Category中的值。但我已经使用了2个选择标签的值进行交互,我如何让输入标签显示响应文本

以下是仅适用于前2个选择标记的示例。输入的内容应响应第二个选择标记。

$("#select1").change(function() { 
  if($(this).data('options') == undefined){
    /*Taking an array of all options-2 and kind of embedding it on the select1*/
    $(this).data('options',$('#select2 option').clone());
  } 
  var id = $(this).val();
  var options = $(this).data('options').filter('[value=' + id + ']');
  $('#select2').html(options);
}); 

$("#select1").trigger('change'); 

小提琴(例子)http://jsfiddle.net/hW4Mm/3/

我自己的文件有:

            <select name="select1" id="select1">
                <?php while ($row = mysqli_fetch_assoc($result1)) {
                    echo "<option value='" . $row['id_ziektesoort'] . "'" . ">" .  $row['naam'] . "</option>";
                }
                ?>
            </select>

            <label>Incident: </label>
            <select name="select2" id="select2">
                <?php while ($row = mysqli_fetch_assoc($result2)) {
                    echo "<option value='" . $row['ziektesoort_id_ziektesoort'] . "'" . ">" .  $row['naam'] . "</option>";
                }
                ?>
            </select> 

            <input name="advies" id="advies" type="text" readonly="readonly"><?php while ($row = mysqli_fetch_assoc($result3)) { 
                echo $row['advies'];
                }?>
            </input>

1 个答案:

答案 0 :(得分:0)

您可以在javascript中添加另一个函数,该函数将在更改select2时调用。下面的函数将在输入文本框中设置select2的文本值。当您更改select2的值时,其文本值将显示在输入文本框中。

$("#select2").change(function() { 

     document.getElementById("text").value=$("#select2 :selected").text(); 


    });

您还必须按如下方式编写输入文本框:

<input type="text" id="text" name="text" value=""></input>

如果您需要更多详细信息,请与我们联系。

小提琴网址:http://jsfiddle.net/hW4Mm/18/