2017-02-16 6 views
15

Я прочитал много сообщений с одной и той же проблемой, но ни одна из них не помогает, поэтому извинения за дублированный вопрос :(Ive следил за простым образцом на сайте JQueryUI по жестким значениям кодирования и работам автозаполнения , но мне нужно, чтобы прийти из моей базы данныхJQuery UI Автозаполнение не достигнуто ActionResult C# MVC

вид:.

@Html.TextBoxFor(model => model.Position, new { @type = "text", @id = "jobtitle", @name = "jobtitle", @placeholder = "Job Title" }) 

JS:

EDIT: Я добавил предупреждение об успехе, и тревога вызывается, но нет, что а (то есть. Нет данных тянут из БД)

<script> 
$(function() { 
      $("#jobtitle").autocomplete({ 
       source: function (request, response) { 
        $.ajax({ 
         url: '@Url.Action("JobsAutoFill", "Account")', 
         data: { 
          Prefix: request.term 
         }, 
         success: function (data) { 
          alert(data); 
          response(data); 
         } 
        }); 
       }, 
       minLength: 1 
      }); 

      //$("#jobtitle").autocomplete({ 
      // source: "/Account/JobsAutoFill/" 
      //}); 
     }); 
</script> 

И я добавил требуются ссылки:

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 

Ниже мой ActionResult (На самом деле JsonResult) & Функции тянуть список Работы:

public List<Jobs> GetAllJobs() 
    { 
     List<Jobs> JobsList = new List<Jobs>(); 

     using (RBotEntities EF = new RBotEntities()) 
     { 
      var JobsListQuery = (from ED in EF.EmploymentDetails 
            select new 
            { 
             ED.pkiEmploymentDetailID, 
             ED.Position 
            }); 

      foreach (var item in JobsListQuery) 
      { 
       JobsList.Add(new Jobs 
       { 
        Id = item.pkiEmploymentDetailID, 
        Name = item.Position 
       }); 
      } 
     } 

     return JobsList; 
    } 

public JsonResult JobsAutoFill(string Prefix) 
     { 
      //Note : you can bind same list from database 


      List<Jobs> ObjList = new List<Jobs>(); 

      ObjList = GetAllJobs(); 

      //Searching records from list using LINQ query 


      var JobNames = (from N in ObjList 
          where N.Name.StartsWith(Prefix) 
          select new { N.Name }); 
      return Json(JobNames, JsonRequestBehavior.AllowGet); 
     } 

Я пропустил что-то или что-то не так?

Я ценю любую помощь, спасибо!

+0

Любой, кто может помочь? – AxleWack

+1

Игнорировать jquery на данный момент. Это метод GET. Попробуйте получить доступ к нему из веб-браузера. Это работает? Является ли сериализация сериализована? Можете ли вы ударить точку останова на сервере? Кроме того, что находится внутри объекта данных? Попробуйте также data.Data –

+0

Теперь мне удалось связаться с контроллером и увидеть, что задания возвращены, но теперь он не показывает (я вижу только маленькие всплывающие окна без текста). Я попробовал data.Data, и он сказал undefined. – AxleWack

ответ

13

У меня это работает!

Первое, что вызывало проблему, заключалось в том, что мне нужно добавить [AllowAnonymous] над моим ActionResult.

Во-вторых, я изменил Ajax вызов к этому:

$(function() { 
    $("#jobtitle").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       url: '@Url.Action("JobsAutoFill", "Account")', 
       data: { 
        Prefix: request.term 
       }, 
       success: function (data) { 
        response($.map(data, function (obj) { 
         return { 
          label: obj.Name, 
          value: obj.Name 
         }; 
        })); 
       } 
      }); 
     }, 
     minLength: 1 
    }); 
}); 

Ниже мой ActionResult. Я добавил изменения, которые будут перебирать чувствительность случая:

[AllowAnonymous] 
public JsonResult JobsAutoFill(string Prefix) 
{ 
    //Note : you can bind same list from database 


    List<Jobs> ObjList = new List<Jobs>(); 

    ObjList = GetAllJobs(); 

    //Searching records from list using LINQ query 


    var JobNames = (from N in ObjList 
        where N.Name.ToLower().StartsWith(Prefix.ToLower()) 
        select new { N.Name }); 
    return Json(JobNames, JsonRequestBehavior.AllowGet); 
} 
3

Вы не должны делать это AllowAnonymous, если оно не должно быть иметь доступ общественности. А во-вторых изменить запрос для повышения производительности:

var JobNames = (from N in ObjList 
       where N.Name.ToLower().StartsWith(Prefix.ToLower()) 
       select N.Name); 

Очевидно, что вам нужно, чтобы вернуть массив строк. Но ваш код возвращает массив объектов, который имеет одно свойство строки.

И изменить код сценария acccording на обновление:

success: function (data) { 
        response($.map(data, function (obj) { 
         return { 
          label: obj, 
          value: obj 
         }; 
        })); 
       } 
3

Dont Change позволяет анонимному изменить Ajax вызов, как, что передать свой параметр в строке запроса это ударит заднюю торцевую функцию. надеюсь, что это поможет вам

$(function() { 
$("#jobtitle").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: '@Url.Action("JobsAutoFill", "Account")?Prefix='+$("#jobtitle").val(), 
      data: { 
       Prefix: request.term 
      }, 
      success: function (data) { 
       response($.map(data, function (obj) { 
        return { 
         label: obj.Name, 
         value: obj.Name 
        }; 
       })); 
      } 
     }); 
    }, 
    minLength: 1 
}); 

});