Problema con render en ajax (Zend)

[faiverson]

En una vista tengo:

Código PHP:

 <div id="articles">
    <?php echo $this->render('index/articles.phtml'); ?>
</div>  

Hago una llamada ajax al hacer un click en un boton que cambia el contenido y en el controller tengo algo asi:

Código PHP:

  public function inthepressajaxAction()
    {
        $this->_helper->ViewRenderer->setNoRender();
        $this->_helper->getHelper('layout')->disableLayout();
        if($this->getRequest()->isXmlHttpRequest()) {
        $this->view->cant = $this->getRequest()->getParam('actual');
            echo $this->render('articles');
        }
    } 
   

Ahora bien mi llamada funciona y reemplaza el contenido de #articles, pero una vez que lo reemplaza, no vuelve a reemplazar si hago click despues del ajax.

Debuggeando me doy cuanta que si hago antes del ajax:
alert($('#articles').attr('id'));
Me devuelve 'articles', pero despues del ajax me devuelve 'undefined', como si no existiese para la pagina ese tag...!

Alguien sabe porque sucede esto?

[_ssx]

Eso tiene que ver con el DOM y javascript, si pones igual parte de tu llamada ajax tal vez podriamos no adivinar.

[faiverson]

Si estaba viendo y detecte parte del problema... pense que era debido a la renderizacion pero nada que ver...
Este es el script:

Código PHP:

  $('.pag').click(function() {
        var actual = trim($('.actualPage').text().split('of'));
        var pag = ($('.pag').hasClass('next')) ? 'next' : 'prev';
        actual = actual[0];
        $.ajax({
            url: basePath+'index/inthepressajax',
            type: 'POST',
            data: 'actual='+ actual+'&pag='+ pag,
            dataType: "html",
            contentType: "application/x-www-form-urlencoded",
            success:function(data){
                $('#articles').empty();
                $('#articles').append(data);                
            },
            error:function(XMLHttpRequest, textStatus, errorThrown){alert('Error: '+XMLHttpRequest.responseText + ' ' + textStatus + ' ' + errorThrown);}
        });
}); 
   

Esa es la llamada.
Resulta que estaba usando $('#articles').replaceWith(data); en lugar de $('#articles').empty();
$('#articles').append(data); y fallaba no se porque...
Tambien falla ese codigo sino cambio la forma en como lo llamo, es decir si llamo
$('.pag').click(function() no funciona, y si lo hace si creo una funcion onClick sobre el tag en cuestion. Ej. <a href="#" onClick="javascript:mifuncion();" class="pag">HOLA</a>

[GatorV]

Tema movido desde PHP orientado a objetos a AJAX

[_ssx]

Es sencillo, los objetos del DOM agregan eventos conforme carga el documento, no obstante al hacer un "replace with" estas reemplazando este elemento del DOM por uno nuevo que no tiene adjuntados los eventos que asignaste con jQuery para eso necesitas usar la "hermosa funcion live"

prueba asi..

Código PHP:

  $('.pag').live('click',function() { 
        var actual = trim($('.actualPage').text().split('of')); 
        var pag = ($('.pag').hasClass('next')) ? 'next' : 'prev'; 
        actual = actual[0]; 
        $.ajax({ 
            url: basePath+'index/inthepressajax', 
            type: 'POST', 
            data: 'actual='+ actual+'&pag='+ pag, 
            dataType: "html", 
            contentType: "application/x-www-form-urlencoded", 
            success:function(data){ 
                $('#articles').empty(); 
                $('#articles').append(data);                 
            }, 
            error:function(XMLHttpRequest, textStatus, errorThrown){alert('Error: '+XMLHttpRequest.responseText + ' ' + textStatus + ' ' + errorThrown);} 
        }); 
}); 
   

usa tus eventos asi y nunca tendras problemas con elementos creados "al vuelo" o reemplazados por llamadas ajax

Código PHP:

  $('selector').live('click',function(){

}); 
   

[faiverson]

Great! Tema resuelto.