méthode link_to et cliquez sur événement dans Rails

Question

Comment puis-je créer un lien de ce type:

<a href="#" onclick="document.getElementById('search').value=this.value"> 

en utilisant la méthode link_to dans Rails? Je ne pouvais pas comprendre à partir de Rails docs.

Answer 1

Vous pouvez utiliser link_to_function (retiré dans Rails 4.1):

link_to_function 'My link with obtrusive JavaScript', 'alert("Oh no!")' 

Ou, si vous devez absolument utiliser link_to:

link_to 'Another link with obtrusive JavaScript', '#', 
     :onclick => 'alert("Please no!")' 

Cependant, JavaScript mettre directement dans votre code HTML généré est , et est mauvaise pratique.

Au lieu de cela, votre code Rails devrait simplement être quelque chose comme ceci:

link_to 'Link with unobtrusive JavaScript', 
     '/actual/url/in/case/javascript/is/broken', 
     :id => 'my-link' 

Et en supposant que vous utilisez le Prototype JS framework, JS comme ceci dans votre application.js:

$('my-link').observe('click', function (event) { 
    alert('Hooray!'); 
    event.stop(); // Prevent link from following through to its given href 
}); 

Ou si vous re en utilisant jQuery:

$('#my-link').click(function (event) { 
    alert('Hooray!'); 
    event.preventDefault(); // Prevent link from following its href 
}); 

Par usi Dans cette troisième technique, vous garantissez que le lien suivra jusqu'à une autre page — non seulement échouer silencieusement — si JavaScript n'est pas disponible pour l'utilisateur. Souvenez-vous que JS peut être indisponible parce que l'utilisateur a une mauvaise connexion Internet (par exemple, appareil mobile, wifi public), l'administrateur système de l'utilisateur ou de l'utilisateur l'a désactivé ou une erreur JS inattendue est survenue (erreur développeur).

Answer 2

Pour donner suite à la réponse de Ron si vous utilisez JQuery et le mettre dans application.js ou la section de tête dont vous avez besoin de l'envelopper dans une section de prêt() ...

$(document).ready(function() { 
    $('#my-link').click(function(event){ 
    alert('Hooray!'); 
    event.preventDefault(); // Prevent link from following its href 
    }); 
}); 

Answer 3

il suffit d'utiliser

=link_to "link", "javascript:function()"