JqGrid con autocompletado no puede analizar datos del controlador para ver

Los últimos días estaba tratando de hacer que jqgrid funcione con los campos de autocompletado, ahora puedo hacer que funcione con datos locales, pero tan pronto como trato de obtener datos de mi controlador, los datos no se analizan.

Ver código:

{ name: 'EanNummer', index: 'EanNummer', width: 65, sortable: true, editable: true, edittype: 'text', editoptions: { dataInit: function (elem) { $(elem).autocomplete({ minLength: 0, source: '@Url.Action("GetBrands")' }) .data("autocomplete")._renderItem = function (ul, item) { return $("
  • ") .data("item.autocomplete", item) .append("" + item.Id + ", " + item.Name + "") .appendTo(ul); }; } } },

    si en lugar de source: url uso source: [“c ++”, “java”, “php”, “coldfusion”, “javascript”, “asp”, “ruby”], por ejemplo, el código funciona bien y aparece, entonces algo debe estar mal con mi código del lado del controlador

    Código de controlador:

      public JsonResult GetBrands() { string vendorId = ""; var username = ""; var name = System.Web.HttpContext.Current.User.Identity.Name; var charArray = name.Split("\\".ToCharArray()); username = charArray.Last(); vendorId = service.GetVendorIdByUsername(username); List list = new List(); var brands = service.getBrandsByVendor(vendorId); var s= (from brand in brands select new { Id = brand.BrandId, Name = brand.BrandName }).ToList(); return Json(s); } 

    Si usa item.Id y item.Name en el lado del cliente, no debe devolver List . En lugar de eso, debe devolver la lista de new {Id=brand.BrandId, Name=brand.BrandName} . Deberías usar LINQ en lugar de foreach :

     return Json ((from brand in brands select new { Id = brand.BrandId, Name = brand.BrandName }).ToList()); 

    ACTUALIZADO : modifiqué para usted la demostración de la respuesta e incluí el soporte de Autocompletar de jQuery UI en dos formas. La representación estándar:

    enter image description here

    y la representación personalizada

    enter image description here

    La funcionalidad Autocompletar funciona en el cuadro de diálogo Búsqueda avanzada de la misma manera que en la barra de herramientas de búsqueda :

    enter image description here

    Puede descargar la demostración desde aquí .

    El código del servidor del autocompletado estándar es

     public JsonResult GetTitleAutocomplete (string term) { var context = new HaackOverflowEntities(); return Json ((from item in context.Questions where item.Title.Contains (term) select item.Title).ToList(), JsonRequestBehavior.AllowGet); } 

    Devuelve una matriz de cadenas en formato JSON. La lista de títulos se filtra por el argumento de term que se inicializará en la cadena escrita en el campo de entrada.

    El código del servidor de la función autocompletar personalizada es

     public JsonResult GetIds (string term) { var context = new HaackOverflowEntities(); return Json ((from item in context.Questions where SqlFunctions.StringConvert((decimal ?)item.Id).Contains(term) select new { value = item.Id, //votes = item.Votes, title = item.Title }).ToList (), JsonRequestBehavior.AllowGet); } 

    Utiliza SqlFunctions.StringConvert para poder usar LIKE en la comparación de los enteros. Además devuelve la lista de objetos que tienen value la propiedad del title . Si devuelve objetos que tengan value las propiedades de la lable , los valores de las propiedades de la lable se mostrarán en el menú contextual de Autocompletar y la propiedad del value correspondiente se insertará en el campo de entrada. Usamos propiedad de title personalizado en su lugar.

    El código del lado del cliente es

     searchoptions: { dataInit: function (elem) { $(elem).autocomplete({ source: '<%= Url.Action("GetTitleAutocomplete") %>' }); } } 

    para la representación estándar y

     searchoptions: { sopt: ['eq', 'ne', 'lt', 'le', 'gt', 'ge'], dataInit: function (elem) { // it demonstrates custom item rendering $(elem).autocomplete({ source: '<%= Url.Action("GetIds") %>' }) .data("autocomplete")._renderItem = function (ul, item) { return $("
  • ") .data("item.autocomplete", item) .append("" + item.value + "" + item.title + "") .appendTo(ul); }; } }

    para la representación personalizada

    Además, uso algunas configuraciones de CSS:

     .ui-autocomplete { /* for IE6 which not support max-height it can be width: 350px; */ max-height: 300px; overflow-y: auto; /* prevent horizontal scrollbar */ overflow-x: hidden; /* add padding to account for vertical scrollbar */ padding-right: 20px; } /*.ui-autocomplete.ui-menu { opacity: 0.9; }*/ .ui-autocomplete.ui-menu .ui-menu-item { font-size: 0.75em; } .ui-autocomplete.ui-menu a.ui-state-hover { border-color: Tomato } .ui-resizable-handle { z-index: inherit !important; } 

    Puede descomentar .ui-autocomplete.ui-menu { opacity: 0.9; } .ui-autocomplete.ui-menu { opacity: 0.9; } si desea tener un pequeño efecto de opacidad en el menú contextual de autocompletar.