Quando utilizamos o zend framework para cada action chamada ele faz forward automaticamente para uma pagina do mesmo nome e quando estamos utilizando AJAX esse não é o objetivo. Para resolver esse problema basta colocar a linha no corpo da action.

  $this->_helper->viewRenderer->setNoRender();

Alguns tutoriais antigos que coloquei sobre AJAX eu utilizava uma página que apenas ecoava o objeto, isso não é necessário utilizando o recurso acima e para colocar o objeto no response para poder ler na página basta fazer.

$this->_response->appendBody($objJson);
Anúncios

Dessa vez vamos considerar uma chamada com parametros. Lembrando que estou usando o framework mootools para ajudar com JSON e na criação do objeto ajax.

O javascript ficará assim:

function ajax(){
            var pagePath = window.location.pathname; 
            var campo1   = $("campo1").value;
            var campo2   = $("campo2").value;

            var parametros = { 'a':campo1,'b':campo2};

            var opcoes =   
            {   
                 "method":"post",   
                 "data": Json.toString(parametros),   
                 "urlEncoded": "false",
                 "headers": {
                                "Content-Type": "application/json; charset=utf-8"
                            }, 
                 "onComplete": completou   
            };   
            
            var ajaxObj = new Ajax(pagePath + "/testeAjax", opcoes).request(); 
}

function completou(result){
    var obj = Json.evaluate(result);
    alert(obj.d); // .net framework 3.5
    alert(obj);  // qualquer outro .net framework
}
    <form id="form1" runat="server">
    <div>
        <input type="text" id="campo1" />
        <input type="text" id="campo2" />
        <input type="button" onclick="javascript:ajax();"
    </div>
    </form>

Agora no code-behind

        [WebMethod()]
        public static int testeAjax(int a, int b)
        {
            return a+b;
        }

Estou usando o mootools para facilitar a criação do objeto request xml.


function ajax(){
            var pagePath = window.location.pathname; 
            var opcoes =   
            {   
                 "method":"post",   
                 "data": "{}",   
                 "urlEncoded": "false",
                 "headers": {
                                "Content-Type": "application/json; charset=utf-8"
                            }, 
                 "onComplete": completou   
            };   
            var ajaxObj = new Ajax(pagePath + "/testeAjax", opcoes).request(); 
}

function completou(result){
    var obj = Json.evaluate(result);
    alert(obj.d); // se tiver usando .net framework >= 3.5
    alert(obj);  // qualquer outro .net framework 
}

O que o pagepath faz?
Apenas pega o conteudo da url e concatena com o nome do pagemethod que foi implementado no code-behind.
Ex.:

http://localhost/default.aspx = default.aspx/testeAjax

No code behind:

        [WebMethod()]
        public static string  testeAjax()
        {
            return "teste";
        }

Post migrado e atualizado em:

http://programatik.soucafecomleite.com.br/ajax-utilizando-ajax-com-zend-framework