Grails passant des paramètres entre taglibs et javascripts

Question

Je crée un widget avec un tag lib, qui dépend de beaucoup de javascript étant poussé vers le navigateur. Je l'ai tout écrit dans le taglib sous forme de texte, et le pousser sans < <, mais je pense que ce serait plus propre si je retirais le script et l'incluais comme un atout. Cependant, avoir du mal à trouver comment séparer le javascript du code grails dans le taglib

Exemple simplifié de ce que je suis en train de faire - disons un tag 'nom' qui affiche le nom d'utilisateur, mais quand vous cliquez sur il alerte les utilisateurs Id:

en tant que tag que je pourrais écrire:

class FooTagLib { 
    static encodeAsForTags = [tagName: [taglib:'html'], otherTagName: [taglib:'none']] 
    static namespace = 'foo' 
    def name = {attrs, body -> 
     out << "<p id = ${attrs.uid}>${attrs.username}</p>" 
     out << "<script type='text/javascript'>" 
     out << """ 
\$('#{$attrs.uid}.click(function() { 
alert("ID for user ${attrs.username} is ${attrs.uid}); }); 
""" 
    } 
} 

Et puis dans mon gsp je pourrais simplement écrire: un

<foo:name username="${user.name}" uid="${user.id}"></foo:name> 

Qu'est-ce que je ne peux pas comprendre comment extraire la fonction de clic hors du taglib dans une bibliothèque javascript, donc je peux transformer FooTagLib en ceci: Comment puis-je passer attrs.username et attrs.uid afin qu'il soit accessible dans le fichier javascript?

class FooTagLib { 
     static encodeAsForTags = [tagName: [taglib:'html'], otherTagName: [taglib:'none']] 
     static namespace = 'foo' 
     def name = {attrs, body -> 
      out << "<p id = ${attrs.uid}>${attrs.username}</p>" 
      out << "<asset: type='text/javascript'>" 
      out << "<asset:javascript src='footag.js'/> 
     } 
    } 

Answer 1

Une façon d'y parvenir consiste à utiliser Jquery data.

Écrivez votre tag comme ceci:

out << "<p id='my-p-with-data' data-id='${attrs.uid}' data-name='${attrs.username}'>${attrs.username}</p>" 

Votre rendu HTML est:

<p id='my-p-with-data' data-id='5' data-name='John Doe'>John Doe</p> 

Et puis, vous devez utiliser JS:

alert("ID for user "+$('#my-p-with-data').data('name') + " is " + $('#my-p-with-data').data('id'))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p id='my-p-with-data' data-id='5' data-name='John Doe'>John Doe</p>