如何从下拉列表中选择一个值以在jQuery中显示结果?

时间:2018-11-08 14:53:49

标签: javascript jquery

我遇到一个问题,我有一个下拉列表显示项目,当您选择一个项目时,它不会显示基于所选项目的表格。我有一个具有自动完成功能的搜索输入-可以,但是我无法使用下拉菜单。有谁知道如何使用jquery或仅使用普通javascript解决此问题?谢谢你的帮助。

这是我的代码

      <select class="selectMenuSize" >
    <option value="">select</option>
    <c:forEach items="#{mybean.jobSearchItems}" var="searchItem">
      <option value="#{searchItem.getSearchValue()}" id="searchInputField" name="searchInput">#{searchItem.toString()}</option>
    </c:forEach>
  </select> 

jquery

     $(function () {
 var myData = [];
              $.get("http://localhost:8080/myApp/JobSearchItem.xhtml", function (data) {
                    $.each(data, function (k, v) {
                        myData.push({
                            id: v.id,
                            label: v.label,
                            value: v.id,

                        });
                    });
                });

                   $("#searchTextField").autocomplete({
                    minLength: 2,
                    source: myData

                });


                $('#searchForm').submit(function () {

                    $('#results').text($(this).serialize());
                    return true;
                });


           });







            function handleSubmit(evt) {
                evt.preventDefault();
                let url = '#{request.contextPath}/index.xhtml';
                let searchValue = document.getElementById('searchTextField').value;
                let data = new FormData();
                data.append('searchValue', searchValue);
                fetch(url, {body: data, method: "post"})
                        .then(res => res.text())
                        .then(text => {
                            let doc = new DOMParser().parseFromString(text, 'text/html');
                            console.log(doc);
                            document.getElementById("results").appendChild(doc.body.firstElementChild);
                        });

           document.getElementById('searchForm').onsubmit = handleSubmit;


            }

0 个答案:

没有答案