How to send ID of an object in jQuery autoComplete?

Navigation
2

I need the ID of the selected item in the jquery Autocomplete, when selecting the item by autocomplete, send the selected item ID to the form. In the label The text when sending via post the item ID 

        public ActionResult Cadastrar()
    {
        var veiculoVM = new VeiculoViewModel();
        veiculoVM.Pessoas = PessoaRepositorio.ListarPessoas()
         .Select(p => new Pessoa() { Nome = p.Nome, Codigo = p.Codigo }).ToList();


    }

  <script type="text/javascript" charset="utf-8">
$(document).ready(function () {

    var Pessoas = new Array();

    @if (Model.Pessoas != null) {
        foreach (var item in Model.Pessoas) {
            @:Pessoas.push('@item'.replace("&#186;", " "));
        }
    }


    $('#Pessoa').autocomplete({
        lookup: Pessoas,
    });
})


   <fieldset>
<div class="control-group">
    @Html.Label("Cliente: ")
    <div class="controls">
        @Html.TextBox("Pessoa")
        @Html.HiddenFor(model => model.CodigoPessoa, new { id = "hidden" })

    </div>
</div>
<div class="control-group">
    @Html.Label("Categoria do Veículo: ")
    <div class="controls">
        @Html.DropDownListFor(v => v.CodigoCategoriaVeiculo, Model.CategoriaVeiculoList)
    </div>
</div>
<div class="control-group">
    @Html.Label("Descrição: ")
    <div class="controls">
        @Html.TextBoxFor(v => v.Descricao, new { maxlength = "20" })
    </div>
</div>
<div class="control-group">
    @Html.Label("Ano de Fabricação: ")
    <div class="controls">
        @Html.TextBoxFor(v => v.AnoFabricacao, new { maxlength = "4" })
    </div>
</div>
<div class="control-group">
    @Html.Label("Placa: ")
    <div class="controls">
        @Html.TextBoxFor(e => e.Placa, new { maxlength = "7" })
    </div>
</div>
<div class="control-group">
    @Html.Label("Chassi: ")
    <div class="controls">
        @Html.TextBoxFor(e => e.Chassi, new { maxlength = "20" })
    </div>
</div>

    
asked by anonymous 09.04.2015 / 18:27

1 answer

1

In your Controller you can return Codigo and nome to Json , leaving your query more performative.

It would look something like this: 

public ActionResult Find( string term)
    {
        var resultado = PessoaRepositorio.METODO IENUMERABLE.Where(c => c.Nome.ToUpper().Contains(term.ToUpper()))
            .Select(c => new { value = c.Nome, id=c.Codigo });

        return Json(resultado.ToArray(), JsonRequestBehavior.AllowGet);

    }

And in your View, you would have the TextBox of the code (hidden) and the name. 

<div class="control-group">
                        @Html.Label("Cliente: ")
                        <div class="controls">
                             <input id="nomeCliente" type="text" class="form-control">
                             <input id="txtCodigo" type="hidden" class="form-control" name="CodigoPessoa"/>
                        </div>
                    </div>

And you would do the search, using AutoComplete , along with a ajax request, thus: 

<script>
    $(function () {
        $("#nomeCliente").autocomplete({
            //           source:  '@Url.Action("Find", "Funcionario")'
            source: function (request, response) {
                $.ajax(
                    {
                        url: "Find",
                        dataType: "json",
                        data: { 'term': request.term },
                        success: response
                    });
            },

            focus: function (event, ui) {
                $("#CodigoPessoa").val(ui.item.value);
            },

            select: function (event, ui) {
                $("#txtCodigo").val(ui.item.value);
                $("#txtCodigo").val(ui.item.id);
                return false;
            }
        });
    });

</script>

Where in script it searches the method Find of its Controller by returning Nome in its AutoComplete and saving the code.

    
09.04.2015 / 18:57
Privacy policy and browser blocking cookies Error importing maven project into Eclipse: In the marketplace entries found to handle