R.Bacaro R.Bacaro - 4 months ago 19
Ajax Question

Asp.net button with ajax dont work

I'm trying to make a button in ASP.NET that call a ajax function and return another ASP.NET, with a method do search in my database. When I click into the button the ajax function it doesn't trigger, doesn't do anything.This Ajax will take something that the user will digit, like a ZIP-code, and will search in my database.



var cepjs = $('#MainContent_cepBrasil').val();
alert(cepjs);
$('#ButtonCEP').click(function () {
alert('cliquei');
$.ajax({
type: "POST",
url: "CEP.aspx/Consulta_CEP",
data: JSON.stringify({ scep: cepjs}),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
$('#MainContent_cepBrasil') = result.CEEP.localCEP;
$('#MainContent_ufEnderecoBrasil') = result.CEEP.localUF;
$('#MainContent_codMunicipioEnderecoBrasil') = result.CEEP.localMunicipio;
$('#MainContent_tpLogradouro') = result.CEEP.localTpLog;
$('#MainContent_descLogradouroBrasil') = result.CEEP.localLogradouro;
$('#MainContent_complementoBrasil') = result.CEEP.localComplemento;
$('#MainContent_bairroBrasil') = result.CEEP.localBairro;

}
});
});

<div class="form-group">
<!--<input Type="button" ID="ButtonCEP" name="btnConsultar_CEP" Class="btn btn-primary btn-sm" value="Consultar" />-->
<button id="ButtonCEP">Consultar</button>
</div>





I've try it to do everything in the ajax, even change the click.function to on('click', function()), but didn't work too, and i try to use some different forms in button style, with button and input type button.

Anyone could help me, I'll appreciate. Thanks

Answer

You have 2 errors here, you are not including the jquery source file, and not waiting for the doc to be ready

$( document ).ready(function() {
    console.log( "ready!" );
    var cepjs = $('#MainContent_cepBrasil').val();
    alert(cepjs);
    $('#ButtonCEP').click(function () {
             alert('cliquei');
             $.ajax({
                type: "POST",
                url: "CEP.aspx/Consulta_CEP",
                data: JSON.stringify({ scep: cepjs}),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (result) {
                    $('#MainContent_cepBrasil') = result.CEEP.localCEP;
                    $('#MainContent_ufEnderecoBrasil') = result.CEEP.localUF;
                    $('#MainContent_codMunicipioEnderecoBrasil') = result.CEEP.localMunicipio;
                    $('#MainContent_tpLogradouro') = result.CEEP.localTpLog;
                    $('#MainContent_descLogradouroBrasil') = result.CEEP.localLogradouro;
                    $('#MainContent_complementoBrasil') = result.CEEP.localComplemento;
                    $('#MainContent_bairroBrasil') = result.CEEP.localBairro;

                }
            });
        });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
<!--<input     Type="button" ID="ButtonCEP" name="btnConsultar_CEP" Class="btn btn-primary btn-sm" value="Consultar" />-->
<button id="ButtonCEP">Consultar</button>
</div>

Comments