17

コントローラ

public ActionResult Search(string id)
{
     id= Request.QueryString["term"];         
     var routeList = db.Movies.Where(r => r.Title.Contains(id))
                   .Take(5)
                   .Select(r => new { id = r.MovieID, label = r.Title, name = "MovieID" });
     return Json(routeList, JsonRequestBehavior.AllowGet);
}

意見：

<input type="hidden"   id="MovieID"  name="MovieID" />
<input type="text" id="SelectedMovie" value=""/>
<script type="text/javascript" language="javascript">
   $("#SelectedMovie").autocomplete({
       source: function (request, response) {
           $.ajax({
              url: "/Transaction/Search", type: "POST", dataType: "json",                        
              data: { id: request.term }, 
              success: function (data) {
              response($.map(data, function (item) {                                
                return { label: item.label, value: item.id }; //updated code
               }));
             }
         });
     },
     select: function (event, ui) {
         $("#MovieID").val(ui.item.value);
         $("#SelectedMovie").val(ui.item.label);
         return false;
     }
  });
</script>

私はある種のビデオストアアプリを持っています。映画をレンタルするときは、オートコンプリートを使用して選択できる映画のコンボボックスが必要です。また、ID（値）のみがデータベースに保存され、テキスト自体は保存されないことが要件です。

編集：ここに完全に機能する例があります

4

3 に答える 3

20

Search()サーバー側の関数に文字列のみを渡すためdata、呼び出しを介して渡す要素を$.ajax()変更する必要があります。

public ActionResult Search(string id)//I think that the id that you are passing here needs to be the search term. You may not have to change anything here, but you do in the $.ajax() call
{
      id= Request.QueryString["term"];

      var routeList = db.Movies.Where(r => r.Title.Contains(id))//this is a text filter no?
                        .Take(5)
                        .Select(r => new { id = r.MovieID, label = r.Title, name = "MovieID" });
      return Json(routeList, JsonRequestBehavior.AllowGet);
}

$("#MovieID").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "/Transaction/Search", type: "POST", dataType: "json",
            //original code
            //data: { searchText: request.id, maxResults: 10 },
            //updated code; updated to request.term 
            //and removed the maxResults since you are not using it on the server side
            data: { id: request.term },

            success: function (data) {
                response($.map(data, function (item) {
                    //original code
                    //return { label: item.FullName, value: item.FullName, id: item.TagId }; 
                    //updated code
                    return { label: item.label, value: item.label, id: item.id };
                }));
            },
        select: function (event, ui) {
                //update the jQuery selector here to your target hidden field
            $("input[type=hidden]").val(ui.item.id);
        }
        });
    },
});

これが機能する/役立つかどうか教えてください！

于 2012-09-20T12:41:19.573 に答える
4

.ajax()呼び出しがで指定されていませんid。data{}オブジェクトには含まれていません。またquerystring、urlパラメーターの一部としても含まれていません（どちらの方法でも機能します）。

したがって、Actionメソッドのnull値。

とにかく、あなたはすぐにメソッドのid引数を。で上書きしていRequest.QueryString["term"]ます。なぜそれをするのですか？

メソッド内の「term」をRequestに要求する代わりに、Action以下のようにパラメーター自体としてメソッドにバインドするだけです。

public ActionResult Search(string term)
{
    var routeList = db.Movies.Where(r => r.Title.Contains(term))
            .Take(5)
            .Select(r => new { id = r.MovieID, label = r.Title, name = "MovieID" });
    return Json(routeList, JsonRequestBehavior.AllowGet);
}
于 2012-09-20T11:51:48.257 に答える
3

まず、関数から次の戻り値を使用する必要があります。

return { label: item.title, value: item.id };

ドキュメントによるとlabel、valueプロパティ（プロパティなし）を含むオブジェクトを返す必要がありidます。ラベルはユーザーに表示されるものであり、値はサーバーに投稿されるものです。

searchText次に、Ajax呼び出しでとを渡すmaxResultsので、アクションメソッドには2つのパラメーターが必要ですpublic ActionResult Search(string searchText, int maxResults)。

これらの変更を適用して、機能するかどうかを確認できますか？

于 2012-09-20T11:17:48.300 に答える