如何在原始值的主输入中显示其他输入

所以我有一个问题，试图找出如何让这个工作。我想进行下拉选择，并且我希望下拉菜单中的所有选项都与原始输入值一起显示在主输入框中。如何在原始值的主输入中显示其他输入

这是我用来发送值到ajax发送到我的PHP文件的表单。

<div class="input-group" id="adv-search"> 
    <input type="text" name="input1" class="form-control" id="filter" id="searchbox" placeholder="Something..."/ required> 
       <div class="input-group-btn"> 
        <div class="btn-group" role="group"> 
         <div class="dropdown dropdown-lg"> 
          <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span></button> 
          <div class="dropdown-menu dropdown-menu-right" role="menu"> 
          <form class="form-horizontal" role="form"> 
          <div class="form-group"> 
          <h4 class="text-center">Advanced Search</h4> 
          <label for="filter">Option</label> 
          <select class="form-control" name="place" id="myList"> 
           <option selected></option> 
           <option value="option1">Option1</option> 
           <option value="option2">Option2</option> 
           <option value="option3">Option3</option> 
          </select> 
          </div> 
          <div class="form-group"> 
           <label for="contain">Location</label> 
           <input class="form-control" name="something1" type="text" id="list2"> 
          </div> 
          <div class="form-group"> 
           <label for="contain">Something2</label> 
           <input class="form-control" name="contain" type="text" id="list3"> 
          </div> 
          <p><br/> 
          <button type="submit" id="insideButton" name="submit" class="btn btn-primary">Advanced Search</button> 
          </form> 
          </div> 
          <button type="submit" id="buttonClass" name="submit2" class="btn btn-primary"><span class="glyphicon glyphicon-search" aria-hidden="true"></span> Search</button> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div>

现在我想从选择下拉（#myList）和其它输入值（＃列表2，＃项目list3）和主输入（#filter）与值一起显示出来输入（＃过滤器）。我的下面的代码会按键显示它们，但它会在函数中重复它。我如何让每个输入在#filter输入中显示。

$('#list2').on("input", function(){ 
    var filter = $(this).val(); 
    var myList = $('#filter').val(); 
    $('#filter').val(filter + " " + myList); 
});

这是我想要完成的图片。任何和所有的帮助，不胜感激。谢谢。

来源

2016-09-25 Stuckfornow

你想选择框的jQuery中值 –

您的标记是奇怪，你有一个以上的ID属性的元素，标签用'for'属性在相关的输入等附近没有？ – adeneo

更改您的jQuery功能以“更改”。 https://fiddle.jshell.net/rqd9phaf/ – Tommy

您好，如果我按照你的形象，你要得到所有选项输入值在主搜索框，如果是这样，你可以试试这个jQuery代码的代码块正确理解

<script> 
      $(document).ready(function() { 
      $("#insideButton").click(function(e) { 
      e.preventDefault(); 
      $("#filter").val($("#list3").val()+" "+ $("#list2").val()+" 
      "+$("#myList").val()+" "+$("#filter").val()); 
      }); 
      }); 
</script>

我只是用一个按钮，提交选项你可以改变它作为你的愿望如果你想提交表单选项，然后会出现一个稍微改变，你也可以写相同的代码

<script> 
      $(document).ready(function() { 
      $(".form-horizontal").on('submit',function(e) { 
      e.preventDefault(); 
      $("#filter").val($("#list3").val()+" "+ $("#list2").val()+" 
      "+$("#myList").val()+" "+$("#filter").val()); 
      }); 
      }); 
</script>

希望它可以帮助你也可以检查此琴 fiddle demo

来源

2016-09-25 05:10:23

与此类似的东西。但是，如果你看看我发布的输入框中的图片，它有“option4”，“option3”，“OPTION2”，“主要输入”，我想要的是，如果用户改变主意并选择不同的选项在下拉框中或在其中一个选项输入框中输入不同的东西时，它将从输入框中移除旧的输入框，并将其替换为在输入框中选择或键入的新选项。 – Stuckfornow

如何在原始值的主输入中显示其他输入

回答

相关问题