I want to use jQuery ui Autocomplete in a MVC C # application that uses a WCF service.
In my controller I make the call to the service and the service consults the database and everything goes well, the controller receives the letter that the user enters, the controller calls the WCF service that goes to the database and returns me a list strongly typed with the information I need depending on the letter entered.
my problem is that it does not show me the results in the @ html.textbox (I use razor as view engine) and then I do not understand what I do wrong, they could help me, this is my vision code
<script type="text/javascript">
$(document).ready(function () {
$("#SearchString").autocomplete({
source: function (request, response) {
$.ajax({
url: '@Url.Action(actionName: "autocompletar", controllerName: "Borrar")',
type: "POST",
dataType: "json",
data: { prefix: request.term },
success: function (data) {
response($.map(data, function (item) {
return { value: item.Id, label: item.name };
}))
}
})
},
select: function (event, ui) {
$("#numeroPatronal").val(ui.item.value);
$("#SearchString").val(ui.item.label);
event.preventDefault();
return false;
},
focus: function (event, ui) {
$("#numeroPatronal").val(ui.item.value);
event.preventDefault();
return false;
},
messages: {
noResults: "", results: ""
}
});
});
</script>
these are the fields of the form
<div class="container col-md-10 col-md-offset-3">
@using (Html.BeginForm())
{
<p> Empresa: @Html.TextBox("SearchString") </p>
<p> Número Patronal: @Html.TextBox("numeroPatronal") </p>
<input type="submit" value="submit" />
}
</div>
and this is the autocomplete action of the Clear controller
public JsonResult autocompletar(string prefix)
{
List<GFC_Site.ViewModels.EmpresaAutocomplete> listado = new List<GFC_Site.ViewModels.EmpresaAutocomplete>();
ProxyGFC.ServiceGFCClient cliente = new ProxyGFC.ServiceGFCClient();
List<WcfService.Entidades.EmpresaAutocomplete> listadoBase = new List<WcfService.Entidades.EmpresaAutocomplete>();
listadoBase = cliente.Autocompletar(prefix);
foreach (var item in listadoBase)
{
GFC_Site.ViewModels.EmpresaAutocomplete dato = new ViewModels.EmpresaAutocomplete();
dato.empresa = item.empresa;
dato.np = item.np;
listado.Add(dato);
}
return Json(listado, JsonRequestBehavior.AllowGet);
}