1

I can't enable "Display search box", bacuse this button not isset in my Web Part steeing. I checked this, reading this instruction

Now I write my input and code javascript to search in list:

Input and button to search:

   <input id="search-input" type="text" placeholder="search ..." onclick="this.value=&#39;&#39;"/>
   <i id="search-submit" class="material-icons">Szukaj</i> </div>

and code JS to search:

document.addEventListener("DOMContentLoaded", function() {

    function inputSearch() {
        var link = "";
        var el = document.querySelector("#search-submit");
        el.addEventListener("click", function(event) {

            event.preventDefault();
            var queryString = document.querySelector("#search-input").value;
            var location = "/Lists/test/calendar.aspx?u=#k=" + queryString;
            link = location;
            document.querySelector("#search-input").setAttribute("value", '');
            window.location.href = link;
            return;
        })
    }

    inputSearch();

    document.querySelector("#search-input").addEventListener("keydown", function(key) {
        console.log(key);
        if (key == 13) {
            document.querySelector("#search-submit").click();
        }
    })
})

I don't know what is URL to search, now I using:

var location = "/Lists/test/calendar.aspx?u=#k=" + queryString;

But JS return still all records from list, I need return only those records in which the query occurs.

0

I found solution, read this article and this article. For example, I have address URL to my list:

/Lists/test/calendar.aspx

and now I must add to URL FilterName and FilterMultiValue:

?FilterName=name_column_where_you_want_search&FilterMultiValue=the_name_of_the_searched_value

My code look like this:

document.addEventListener("DOMContentLoaded", function() {

    function inputSearch() {
        var link = "";
        var el = document.querySelector("#search-submit");
        el.addEventListener("click", function(event) {

            event.preventDefault();
            var queryString = document.querySelector("#search-input").value;
            var selected = document.querySelector("#select-list").value;

            var location = "/Lists/test/calendar.aspx?FilterName=" + selected + "&FilterMultiValue=*" + queryString + "*";
            link = location;
            document.querySelector("#search-input").setAttribute("value", '');
            window.location.href = link;
            return;
        })
    }

    inputSearch();

    document.querySelector("#search-input").addEventListener("keydown", function(e) {
        if (e.key == 'Enter') {
            document.querySelector("#search-submit").click();
        }
    })
})

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.