部分視圖上的Jquery自動完成結果

Question

是否可以在部分視圖上顯示Jquery自動完成的結果？ 這就是我現在展示的方式，我希望能夠在局部視圖上顯示結果，以便我可以更好地控制風格結果。

$(document).ready(function() { 
     $('*[data-autocomplete-url]') 
      .each(function() { 
       $(this).autocomplete({ 
        source: $(this).data("autocomplete-url"), 
        minLength: 2, 
        messages: { 
         noResults: "", 
         results: function() { } 
        }, 
        select: function (event, ui) { 
         return false; 
        }, 
       }); 
      }).data("autocomplete")._renderItem = function (ul, item) { 
       return $("<li></li>") 
        .data("item.autocomplete", item) 
       ) 
.append('<table><tr><td valign="top"><img style="width:30px;height:30px;" src="' + "/Images/Image.jpg" + '" /></td><td valign="top">' + item.FirstName + item.LastName + '</td></tr></table>') 
             .appendTo(ul); 
      } 
    }); 

此外，當用戶從結果中選擇一個項目，我想通過將ID來調用一個控制器動作，任何人都可以提供此一個代碼示例？

我正在使用Asp.net MVC 4,

謝謝！

Answer 1

您無法僅使用jQuery渲染局部視圖。但是，您可以調用一個方法（動作），它將爲您呈現局部視圖並使用jQuery/AJAX將其添加到頁面中。 當用戶選擇一個項目或懸停一個項目時，只需使用jquery函數並使用ajax將該ID傳遞給服務器並返回Partail視圖。

$.get('<%= Url.Action("details","user", new { id = Model.ID } %>', function(data) { 
    $('#detailsDiv').replaceWith(data); 
}); 

剃刀

$.get('@Url.Action("details","user", new { id = Model.ID })', function(data) { 
    $('#detailsDiv').replaceWith(data); 
}); 

其中用戶控制器有一個名爲動作細節做：

public ActionResult Details(int id) 
{ 
    var model = ...get user from db using id... 

    return Partial("UserDetails", model); 
} 

參考這些鏈接，你會得到一個更好的主意。 Render Partial View Using jQuery in ASP.NET MVC， http://www.codeproject.com/Articles/41828/JQuery-AJAX-with-ASP-NET-MVC， ASP.NET MVC AJAX with jQuery

感謝。希望這可以幫助你。