2

オートコンプリート入力タイプのために、初めて JSON を実装しようとしています。

@{
    ViewBag.Title = "Index";
}

<script type="text/javascript">
function searchFailed(){
$("#searchresults").html("Sorry, there was a problem with the search.");
}
    $("input[data-autocomplete-source]").each(function () {
        var target = $(this);
        target.autocomplete({ source: target.attr("data-autocomplete-source") });
    });
</script>

<h2>Index</h2>

@using (Ajax.BeginForm("QuickSearch", "Search", new AjaxOptions { InsertionMode = InsertionMode.Replace, HttpMethod = "GET", OnFailure = "searchFailed", LoadingElementId = "ajax-loader", UpdateTargetId = "searchresults", }))
{
<input type="text" name="q" data-autocomplete-source="@Url.Action("QuickSearch", "Search")" />

}

しかし、data-autocomplete-source が有効な属性ではないと不平を言っています。クイックサーチには入りますが、オートコンプリートの結果が表示されません。

4

1 に答える 1

0 
 target.data("autocomplete-source");

データ属性を使用します。jQuery。データ

交換：

$("input[data-autocomplete-source]").each(function () {
    var target = $(this);
    target.autocomplete({ source: target.attr("data-autocomplete-source") });
});

と：

$(function () {
    $("input[data-autocomplete-source]").each(function () {
        var target = $(this);
        target.autocomplete({ source: target.data("autocomplete-source") });
    });
});

ページが「準備完了」になり、要素が存在する$(function () {})まで待機していました。

変化する：

<input type="text" name="q" data-autocomplete-source="@Url.Action("QuickSearch", "Search")" />

に：

<input class="my-autocomplete" type="text" name="q" data-autocomplete-source="@Url.Action("QuickSearch", "Search")" />

そして変更：

$("input[data-autocomplete-source]").each

に：

$("input.my-autocomplete").each
于 2012-06-17T23:18:41.607 に答える