Блог

Я пытаюсь реализовать автозаполнение, однако я обнаружил, что оно не передает частичную строку, я использую MVC3, механизм просмотра razor и jquery, чтобы собрать все это вместе.

 <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css" type="text/css" media="all" /> 
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript">  </script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript">   </script>

<script type="text/javascript">
$(function (request) {
    alert("test:"   $("#searchTerm").val());
    $("#searchTerm").autocomplete({
        source: "/Home/GetAccounts/"   $("#searchTerm").val(),
        type: 'POST',
        dataType: 'json',
        data: request.term,
        minLength: 3,
        select: function (event, ui) {
            window.location.href = 'Home/GetAccounts/'   ui.item.value;
        }
    });
});

</script>

@using (Html.BeginForm())
{               
 <form method="post" action="">
 <input id="searchTerm" name="searchTerm" type="text" />
     <input type="submit" value="Go" />
 </form>

}  
  

А ниже приведен контроллер

     public ActionResult GetAccounts(string id)
    {
        var accounts = NavRepository.GetAccountsBasedOnString(id);
        var accountStrings = new string[accounts.Count];
        var count = 0;

        foreach (var account in accounts)
        {
            accountStrings[count] = account.AccountID;
            count  ;
        }

        return Json(accountStrings, JsonRequestBehavior.AllowGet);
    }
  

Я искал в нескольких местах (например http://jqueryui.com/demos/autocomplete/#remote-jsonp ) в том числе и здесь, но, похоже, я просто не могу разгадать эту загадку.

Дополнительно вот как я пишу свои маршруты.

   public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            "Default", // Route name
            "{controller}/{action}/{id}", // URL with parameters
            new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
        );

    }
  

И, как отмечено в комментариях, если я устанавливаю value=»test» для searchTerm, он отправляет только эту строку

Проблема в том, что когда вы устанавливаете источник вашего автозаполнения, он принимает значение текстового поля в момент, когда это делается (т. Е. При загрузке DOM) => значение на данном этапе пустое. Обработчик события document.ready не принимает объект запроса.

Вы можете передать функцию в source свойство при подключении автозаполнения:

 $(function() {
    $('#searchTerm').autocomplete({
        source: function(request, response) {
            $.ajax({
                url: '@Url.Action("GetAccounts", "Home")',
                data: { id: request.term },
                dataType: 'json',
                type: 'POST',
                minLength: 3,
                select: function (event, ui) {
                    window.location.href = '@Url.Action("GetAccounts", "Home")'   ui.item.value;
                }
          });
    });
});