Rails link_to: Fare qualcosa dopo la conferma

Question

sto cercando di eseguire un salvataggio azione tramite la tecnologia AJAX utilizzando link_to:

<%= link_to 'Save', image_path(image), method: :patch, 
     data:{ confirm: 'Save image?', remote: true } %> 

Voglio il link per essere sostituito con <span>Saving...</span> sulla conferma, ma non riesco a capire una modo pulito per farlo.

Problemi con le soluzioni esistenti:

disable_with:
Se aggiungo :disable_with => '<span>Saving...</span>' il codice HTML interno del collegamento sarà sostituito al posto del link stesso. Non voglio quello

onclick:
Se aggiungo :onclick => "$(this).replaceWith('<span>Saving...</span>');" il link sarà sostituito immediatamente, anche se l'utente annulla la conferma

C'è una soluzione che si adatta con Rails 3 UJS best practice?

Answer 1

Penso che questo sia un caso in cui la funzionalità desiderata va oltre quella offerta dagli helper JS di Rails. A questo punto vorrei semplicemente evitare di usare: confirm e: remote options per link_to, e implementarlo in plain jQuery UJS o simili.

Si potrebbe anche pensare in termini di nascondere il collegamento e mostrare lo span 'Salvataggio ...' quando l'utente conferma, piuttosto che sostituire html; Penso che finirà per semplificare in questo modo, e ti darà ancora l'effetto che stai cercando.

Answer 2

È possibile utilizzare il gancio ajax:beforeSend:

$('a#my_link_to').bind('ajax:beforeSend', function(evt, xhr, settings) { 
    $(this).replaceWith('<span>Saving...</span>'); 
}) 

E poi si potrebbe aggiungere un binding a ajax:success:

$('a#my_link_to') 
    .bind('ajax:beforeSend', function(evt, xhr, settings) { 
    $(this).replaceWith('<span id="saving">Saving...</span>'); 
    }) 
    .bind('ajax:success', function(evt, data, status, xhr) { 
    $('span#saving').replaceWith('Saved!'); 
    }) 

Nota: Si prega di fare riferimento al commento qui sotto, che è anche molto importante

Answer 3

Penso che dovresti usare confermare: completare l'evento. (Dettagli: https://github.com/rails/jquery-ujs/blob/master/src/rails.js)

Answer 4

Ecco come ho finito per farlo:

<%= link_to 'Save', image_path(image), method: :patch, 
     data:{ confirm: 'Save image?', remote: true }, 
     onclick: "$(this).one('ajax:beforeSend', 
      function(e) { $(this).replaceWith('<span>Saving...</span>'); });" %> 

(Il problema di questa soluzione è che i gestori si accumulano se l'utente fa clic, non conferma, scatta di nuovo, ecc .. Pertanto non è l'ideale ...)

Answer 5

È possibile utilizzare l'evento confirm:complete. Ottiene un secondo argomento booleano passato che indica se il risultato è stato cancellato o ok.