Foros del Web » Programando para Internet » Jquery »

Problema al seleccionar un padre con jQuery.ajax

Estas en el tema de Problema al seleccionar un padre con jQuery.ajax en el foro de Jquery en Foros del Web. Muy buenas, estoy realizando una web que tiene como característica un enlace vía ajax que devuelve del servidor un HTML que debe reemplazar al contenedor ...
  #1 (permalink)  
Antiguo 27/06/2012, 10:20
 
Fecha de Ingreso: mayo-2011
Mensajes: 12
Antigüedad: 13 años
Puntos: 0
Problema al seleccionar un padre con jQuery.ajax

Muy buenas, estoy realizando una web que tiene como característica un enlace vía ajax que devuelve del servidor un HTML que debe reemplazar al contenedor padre de ese enlace ajax. El problema es que en el método complete no consigo acceder al contenedor padre (o al menos, averiguar el ID del selector que dispara el ajax). El código jquery es el siguiente:

Código Javascript:
Ver original
  1. $('body').on('click','#yt3',function(){
  2.      jQuery.ajax({
  3.           'complete':function(data){
  4.                console.log($(this));
  5.                console.log($(this).closest("div.publicacion-footer"));
  6.                $(this).closest("div.publicacion-footer").replaceWith(data);
  7.      })
  8. });

Y el HTML es el siguiente:
Código HTML:
Ver original
  1. <div class="publicacion-footer">
  2.     <div class="publicacion-footer-derecha">
  3.         <button>xxx</button>
  4.         <button>yyy</button>
  5.     </div>
  6.     <div class="publicacion-footer-izquierda">
  7.         <button name="yt3" type="button" id="yt3">zzzz</button>
  8.     </div>
  9. </div>

Bien, use console.log de $(this) y $(this).closest("div.publicacion-footer") para ver si me devolvían algo, el segundo no devuelve nada y el primero devuelve un objeto con la siguiente información:
Código Javascript:
Ver original
  1. accepts: Object
  2. async: true
  3. cache: false
  4. complete: function (data){ console.log($(this)); console.log($(this).closest("div.publicacion-footer")); $(this).closest("div.publicacion-footer").replaceWith(data); }
  5. contentType: "application/x-www-form-urlencoded"
  6. contents: Object
  7. converters: Object
  8. crossDomain: false
  9. dataTypes: Array[2]
  10. flatOptions: Object
  11. global: true
  12. hasContent: false
  13. isLocal: false
  14. jsonp: "callback"
  15. jsonpCallback: function () {
  16. processData: true
  17. responseFields: Object
  18. type: "GET"
  19. url: "/cod/index.php/publicaciones/favorito/2?_=1340812969363"
  20. xhr: function createStandardXHR() {
  21. __proto__: Object

Me gustaría saber si a través del objeto $(this) puedo acceder al padre con clase "publicacion-footer", o sí hay alguna manera a través de jQuery de acceder, estuve leyendo la documentación de jQuery.ajax pero no he conseguido averiguar nada en claro. Espero que alguien pueda darme algún atisbo de luz a este problema.

Gracias :)
  #2 (permalink)  
Antiguo 27/06/2012, 10:40
 
Fecha de Ingreso: junio-2008
Ubicación: Colombia
Mensajes: 207
Antigüedad: 15 años, 10 meses
Puntos: 12
Respuesta: Problema al seleccionar un padre con jQuery.ajax

prueba con parents, aunque debes tener cuidado en que si reemplazas el contenido que viene desde ajax perderas el boton a menos que venga desde ajax otra vez lo cual seria innecesario.
En fin en vez de closest prueba con parents de esta forma

Código Javascript:
Ver original
  1. $(this).parents('div').eq(1).html(data)
  2. // el el eq(1) se refiere al segundo parent que encuentre, 0 seria donde esta el boton
  #3 (permalink)  
Antiguo 27/06/2012, 11:58
 
Fecha de Ingreso: mayo-2011
Mensajes: 12
Antigüedad: 13 años
Puntos: 0
Respuesta: Problema al seleccionar un padre con jQuery.ajax

Con lo que me has dicho me lo he pensado mejor y tienes razón, si vuelvo a actualizar el contenedor tengo dos opciones, o hago un delegate para que los ajax estén nuevamente activos o será necesario reenviar las nuevas ordenes de jQuery para que los botones vuelvan a funcionar, por lo que he cambiado el enviar un HTML por enviar un json, pero sigo en la misma.

En cuanto a tu solución probe en su día $(this).parents('div:eq(0)').html(data), que es el primer div que tiene encima, sin que funcionase (he probado tu propuesta en otros scripts con éxito).

Bien, he actualizado el script y queda de la siguiente manera (pongo directamente la parte del servidor que me es más fácil)
Código PHP:
Ver original
  1. 'ajaxOptions' => array(
  2.                         'beforeSend' => 'js:function(){ $(this).addClass("disabled").text("Actualizando..."); }',
  3.                         'complete' => 'js:function(data){ $(this).removeClass("disabled").text(data.texto); }'
  4. ),

Hay una duda que me corroe de base al script que me genera Yii es que en antes del jQuery.ajax empieza con $('body').on('click','#yt3',function(){ ... } y me temo que al hacer $(this) me esta devolviendo el body en vez del selector...
  #4 (permalink)  
Antiguo 09/07/2012, 02:41
 
Fecha de Ingreso: mayo-2011
Mensajes: 12
Antigüedad: 13 años
Puntos: 0
Respuesta: Problema al seleccionar un padre con jQuery.ajax

¿Alguien más puede echarme una mano con esto? Gracias :)

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:35.