使用AngularJS

Question

我有一个过滤器和一个搜索文本框。在下拉列表中，我将其划分为两个搜索项，即一个是＆＃34;无＆＃34;它将过滤表中的所有列（整个表），第二部分包含表中存在的其余列名，这些列名将根据其名称进行过滤。

选择＆＃34;无＆＃34;它正在搜索整个表格并显示结果。 现在的问题是当我从下拉列表中选择其他字段并尝试在搜索文本框中写入内容时，它无法让我输入任何内容。

以下是我正在使用的代码：

<div class="row filterbyHeading">
    FilterBy<br>
    </div><!-- End of FilterBy heading -->
    <div class="row">
    <select ng-style="{"width": getMaxLength()}" class="filterbyTextbox" id="filterSearch" ng-model="filterSearch">
    <option value="None">None</option>
    <option value="Apple">Apple</option>
    <option value="Orange">Orange</option>
    <option value="Mango">Mango</option>
    <option value="Banana">Banana</option>
    <option value="Pineapple">Pineapple</option>
    </select>

    <!--search function to search data in table-->
    <input type="search" id="Search1" ng-model="search" class="form-control searchTextbox" placeholder="Search"/>
    <input type="search" id="Search2" ng-model="search[filterSearch]" class="form-control searchTextbox" placeholder="Search Filter"/>
    </div>
    </div>

上述代码的脚本：

<script>

    $("#Search1").show();
    $("#Search2").hide();
    $(document).on("change", "#filterSearch", function() {
   var selectedValue = $(this.selectedOptions).text();
      if(selectedValue==="None"){
        $("#Search1").show();
        $("#Search2").hide();
        $("#Search1").val('');
        $("#Search2").val('');
     }else{
        $("#Search1").hide();
        $("#Search2").show();

        $("#Search1").val('');
        $("#Search2").val('');
     } 
   });


</script>