jQuery不會清除TextBox，而$ .get（）不會傳遞參數

Question

我在頁面上有一個項目列表，可以通過文本框進行過濾（類似於MVC教程）。 我有一個按鈕，我想清除 TextBox中的文本並調用controller函數，該函數隨后將使項目列表回到其初始的未過濾狀態。

我遇到的問題是雙重的：清除TextBox文本的jQuery代碼沒有清除搜索詞的TextBox，並且將空字符串作為參數顯式傳遞給控制器​​的jQuery代碼沒有傳遞給我參數。

例如：

1. 頁面上有東西列表。
2. 我在過濾器框中輸入“放屁”，然后按Enter。
3. 頁面重新加載，並且東西列表現在被“放屁”過濾。
4. 我按清除按鈕。
5. 頁面將重新加載，但內容列表仍按“放屁”過濾，並且不會清除TextBox。

我懷疑這都是由於未清除TextBox，但老實說我不知道​​。

Index.cshtml

@{
    ViewBag.Title = "Index";
    var modelitem = new MyThing();
}

@model IEnumerable<MyModel>

<script type="text/javascript">
    function fart() {
        $('#reset').click(function() {
            $('#filterTerm').val('');
            $.get("SelectionSummary/Index", { filterTerm: '' })
        });
    }
</script>

@using (Html.BeginForm())
{
    <div class="input-group center-block">
        <h3 class="text-center">Selections</h3>
        @Html.AntiForgeryToken()
        @Html.TextBox("filterTerm", null, new
                   {
                        @id = "filterTerm",
                        @class = "form-control col-md-offset-2",
                        @placeholder = "Filter"
                   })
        <input id="reset" class="btn btn-info" type="submit" value="reset" onclick="fart"/>
    </div>
}

<br />
@if (Model != null && Model.Any())
{
<div class="panel panel-default col-md-offset-2" style="width:62%">
    <div class="panel-body">
        <br />
        <table class="table table-striped text-center">

            <tr>
                <th>
                    @Html.DisplayFor(m => modelitem.NameLabel)
                </th>
                <th>
                    @Html.DisplayFor(m => modelitem.Thing)
                </th>
            </tr>
            @foreach (var thing in Model.OrderBy(g => g.Name))
            {
                <tr>
                    <th>
                        @Html.ActionLink(thing.Name, "Detail", new { selectionSearchTerm = thing.Name })
                    </th>
                    <th>
                        @Html.DisplayFor(m => thing.Other.Name)
                    </th>
                </tr>
            }
        </table>
    </div>
</div>
}
else
{
    <h4 class="text-center">No results</h4>
}

SelectionSummaryController.cs

 public ActionResult Index(string filterTerm = "")
 {
        var stuff= m_repo.GetAllStuff();
        if (stuff.IsNullOrEmpty()) // extension method
        {
            return View();
        }

        if (filterTerm.HasValue()) // extension method
        {
            stuff= stuff.Where(t => t.Name.Contains(filterTerm));
        }

        return View(stuff.ToList());
 }

Answer 1

我相信您的問題在於使用HasValue. 我將更改為：

public ActionResult Index(string filterTerm = "")
 {
        var stuff= m_repo.GetAllStuff();
        if (stuff.IsNullOrEmpty())
        {
            return View();
        }

        if (!string.IsNullOrEmpty(filterTerm))
        {
            stuff= stuff.Where(t => t.Name.Contains(filterTerm));
        }

        return View(stuff.ToList());
 }

此外，您的JavaScript沒有任何意義。 為什么在單擊按鈕時將click事件處理程序放在按鈕上？ 嘗試這個。

<script type="text/javascript">
    function fart() {
            $('#filterTerm').val('');
            $.get("SelectionSummary/Index", { filterTerm: '' })
    }
</script>

話雖如此，我不確定您為什么還要使用該ajax get。 您沒有對數據做任何事情。