0

検索ボックスから入力を受け取り、サーバーにヒットして結果を取得し、リストビューをレンダリングする kendo dataSource に渡すこの検索機能に取り組んでいます。コードは次のとおりです。

 function searchClick(searchTerm) {

    var searchText = searchTerm;
    if (!searchTerm) {
        return;
    }

    var listView = $("#listView").data("kendoListView");
    if (!listView)
        createUI(searchText);
    else {
        listView.dataSource.read({
            searchTerm: searchText
        });
    }
}

> `function createUI(searchText) {`

    var tmpl = kendo.template($("#template").html());
    var dataSource = new kendo.data.DataSource({
        serverPaging: true,
        schema: {
            data: "ListMedia",
            total: "RowCount",
        },
        transport: {
            read: {
                url: gAppBaseURL + "Search/SearchData",
                type: "GET",
                dataType: "json",
                data: {
                    searchTerm: searchText,
                    pageSize: 25,
                    page: 1
                }
            }
        }

    });

    $("#listView").kendoListView({
        dataSource: dataSource,
        autoBind: false,
        template: tmpl,
        dataBound: function () {
            var ds = $("#listView").data("kendoListView").dataSource;
            if (ds.total() == 0) {
                return;
            }
        }
    });

    var pager = $("#pager").kendoPager({
        dataSource: dataSource,
        autoBind: false,
    }).data("kendoPager");

    return dataSource.read();
}

次に、リストビューとページャーにデータをロードします。

問題は、ページングを行うときに、以前に入力した検索値をサーバーに渡すことです。たとえば、最初に「Cat」と入力すると、(最初の検索で) cat レコードの結果が正しく読み込まれますが、dog を検索すると最初のページの結果は正しいのですが、2 ページ目に切り替えると「Cat」が次のように渡されます。 cat の結果を返すサーバーへのパラメーター。以下は私のHTMLです:

<div class="SearchResultPage">
<input type="text" name="searchTextbox" id="searchTextbox" class="k-textbox" style="width:400px"/>
<button type="submit" id="btn_submitQry" onclick="onClickSearch()"></button>

<script>

    function onClickSearch() {
        var searchTerm = $('#searchTextbox').val();
        if (!searchTerm) {
            searchTerm = "@ViewBag.SearchText";
            $('#searchTextbox').val(searchTerm);
        }

        searchClick(searchTerm); //defined in universalSearch.js file
    }
</script>

別のページに切り替えるたびに (何かを検索する 2 回目)、以前の検索用語がサーバーに渡されます。

4

1 に答える 1