2009-08-05 5 views
10

J'ai fonctionné pour la plupart. Mon lien rails est:Rails détruisent confirment avec Jquery AJAX

<%= link_to(image_tag('/images/bin.png', :alt => 'Remove'), @business, :class => 'delete', :confirm => 'Are you sure?', :id => 'trash') %> 

:class => "delete" appelle une fonction ajax afin qu'il soit supprimé et la page n'est pas rafraîchi qui fonctionne très bien. Mais parce que la page ne rafraîchit pas, elle est toujours là. Donc, ma poubelle id appelle cette fonction jquery:

$('[id^=trash]').click(function(){ 
      var row = $(this).closest("tr").get(0); 
      $(row).hide(); 
      return false; 
}); 

Ce qui se cache la ligne de ce que je icône de la corbeille cliqué. Cela fonctionne aussi très bien. Je pensais que tout avait fonctionné et j'ai ensuite rencontré ce problème. Lorsque vous cliquez sur ma poubelle, je peux avoir cette boîte de confirmation pour vous demander si vous êtes sûr. Que vous choisissiez d'annuler ou d'accepter, la jquery se déclenche et cache la ligne. Il n'est pas supprimé, seulement caché jusqu'à ce que vous actualisiez la page. J'ai essayé de le changer afin que l'invite soit faite par jquery, mais alors les rails supprimaient la rangée indépendamment de ce que j'ai choisi dans mon invite parce que la fonction .destroy était appelée quand l'invite était appelée. Ma question est vraiment comment puis-je obtenir la valeur d'annuler ou d'accepter des rails confirmer pop-up de sorte que dans ma jquery je peux avoir une déclaration si qui se cache si elles cliquent sur accepter et ne fait rien si elles cliquent sur annuler.

EDIT: réponse à la question ci-dessous. Cela n'a pas fonctionné. J'ai essayé de changer mon lien vers:

<%= link_to(image_tag('/images/bin.png', :alt => 'Remove'), @business, :class => "delete", :onclick => "trash") %> 

et de mettre dans mon jquery

function trash(){ 
if(confirm("Are you sure?")){ 
    var row = $(this).closest("tr").get(0); 
    $(row).hide(); 
    return false; 
} else { 
//they clicked no. 
} 
} 

Mais la fonction n'a jamais été appelée. Il supprime simplement sans invite et ne le cache pas. Mais ça m'a donné une idée.

Je pris la fonction de suppression qu'Ajax appelait

 $('a.delete').click (function(){ 
      $.post(this.href, {_method:'delete'}, null, "script"); 
      $(row).hide(); 
}); 

et a modifié la mise en œuvre du code:

enlever :confirm => 'Are you sure?'

$('a.delete').click (function(){ 
     if(confirm("Are you sure?")){ 
      var row = $(this).closest("tr").get(0); 
      $.post(this.href, {_method:'delete'}, null, "script"); 
      $(row).hide(); 
      return false; 
     } else { 
      //they clicked no. 
      return false; 
     } 

}); 

Ce qui fait l'affaire.

Répondre

3

Vous pouvez supprimer le:

:confirm => 'Are you sure?' 

et le remplacer par un événement sur mesure onclick, comme ceci:

<%= link_to(image_tag('/images/bin.png', :alt => 'Remove'), @business, :class => 'delete', :onclick => 'someJSFunction', :id => 'trash') %> 

Ensuite, dans votre application.js (ou tout autre fichier JS), faire:

function someJSFunction(){ 
    if(confirm("Are you sure?"){ 
    //they clicked yes. 
    } else { 
    //they clicked no. 
    } 
} 

Désolé, je n'ai pas le temps de le tester en ce moment, mais que devrait travail.

+0

Cela n'a pas fonctionné mais cela m'a conduit à la réponse. – Mike

+1

Puis upvote pour ma serviabilité! ;) –

12

supprimer: confirmer => 'Êtes-vous sûr?'

$('a.delete').click (function(){ 
      if(confirm("Are you sure?")){ 
       var row = $(this).closest("tr").get(0); 
       $.post(this.href, {_method:'delete'}, null, "script"); 
       $(row).hide(); 
       return false; 
      } else { 
       //they clicked no. 
       return false; 
      } 

    }); 
5

Merci les gars, j'ai utilisé le tutoriel suivant pour mettre en place jquery avec rails:

http://www.notgeeklycorrect.com/english/2009/05/18/beginners-guide-to-jquery-ruby-on-rails/

lorsqu'il est utilisé en conjonction avec ce tutoriel, j'ai utilisé le code suivant:

 
Query.fn.deleteWithAjax = function() { 
    this.removeAttr('onclick'); 
    this.unbind('click', false); 
    this.click(function() { 
     if(confirm("Are you sure?")){ 
      $.delete_($(this).attr("href"), $(this).serialize(), null, "script"); 
      return false; 
     } else { 
      //they clicked no. 
      return false; 
     } 
    }) 
    return this; 
}; 
3

J'ai eu un problème similaire, mais après avoir lu ce fil, j'ai retiré la confirmation de mon bouton et a fait ce qui suit dans jquery:

$('.delete_post').on('click', function(){ if(confirm("Are you sure?")){ $(this).closest('tr').delay().fadeOut(); } else{ return false; } });

Et il semble faire l'affaire pour moi. J'ai également ajouté cela à mon action de destruction dans le contrôleur:

respond_to do |format| 
    format.html { render :nothing => true } 
    format.json { head :no_content } 

P.S. Ne pas oublier d'ajouter: remote => true au link_to

+1

Voulez-vous dire: remote => true? – Galaxy

+0

Ah oui merci – moon4e