Jquery does not send the parameter to search

Asked

Viewed 67 times

1

I need to do something like this feature: Jquery Autocomplete

jQuery:

$("#NumeroContrato").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: 'GET',
                url: 'Cliente/ListarClientePorContratoJSON',
                dataType: 'jsonp',
                crossDomain: true,
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            label: item.Nome,
                            id: item.ClienteID
                        }
                    }))
                },
            });
        },
        minLength: 1,
        select: function (event, ui) {
            $("#NumeroContrato").val(ui.item.label);
            $("#ClienteID").val(ui.item.id);
            alert(ui.item.id);
            event.preventDefault();
        }
    });

HTML:

<input type="hidden" id="ClienteID" name="ClienteID">
<div class="col-xs-2">
    <label>Num. Contrato</label><br />
    <input type="text" id="NumeroContrato" name="NumeroContrato" value="" class="form-control" />
</div>

Controller:

public JsonResult ListarClientePorContratoJSON(string NumeroContrato)
{
    try
    {
        //AQUI VOU FAZER A CHAMADA PARA PESQUISA DO NUMERO DO CONTRATO:
    }
    catch (Exception)
    {
        return Json("erro", JsonRequestBehavior.AllowGet);
    }
}

Problem: The problem is that the variable Numerocontrato is always equal to Null inserir a descrição da imagem aqui

1 answer

3

If it is GET, you need to put the parameter in the URL, otherwise it will not work, obviously:

$("#NumeroContrato").autocomplete({
    source: function (request, response) {
        $.ajax({
            type: 'GET',
            url: '/Cliente/ListarClientePorContratoJSON/' + $("#NumeroContrato").val(), // Não sei se $(this).val() funciona aqui. Vale a pena um teste. 
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                        label: item.Nome,
                        id: item.ClienteID
                    }
                }))
            },
        });
    },
    minLength: 1,
    select: function (event, ui) {
        $("#NumeroContrato").val(ui.item.label);
        $("#ClienteID").val(ui.item.id);
        alert(ui.item.id);
        event.preventDefault();
    }
});

If the request is made within the same site, you do not need to use crossDomain: true, nor dataType: jsonp.

  • The solution was to change the parameter crossDomain = true, because it is no different domain, and I ended up changing also the type: GET for POST then it worked.

  • About the crossDomain that’s right. I’ve updated the answer. In case you use POST or GET, works both ways. It all depends on how you set up your Controller.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.