7
votes

Appliquer jQuery UI widgets à AJAX Éléments chargés

Je veux activer le widget de bouton JQueryui sur un sélecteur donné, disons ".button '.

Quelle est la meilleure façon d'activer automatiquement le widget sur tout nouvel" Boutte "inséré dans le DOM après l'initiale. Charge de page via Ajax.

Auparavant, j'ai utilisé le LivePlugin avec code quelque chose comme ceci: xxx

puisque "Live" a été déplacé vers le noyau de jQuery La fonction en direct nécessite un type d'événement comme premier paramètre de sorte que cela n'est plus possible. Y a-t-il une méthode alternative dans le noyau de jQuery qui y arrivera?


0 commentaires

3 Réponses :


8
votes

Vous avez quelques options ici. Premièrement, il y a le Plugin LiveQuery , comme ceci:

function rigUI(context) {
  $('.button', context).button();
  $('.date', context).datepicker();
}

$(rigUI); // Load at document.ready, default context is document

//in ajax load love above call: rigUI(data);


1 commentaires

Merci, j'avais envisagé d'utiliser le plugin LiveQuery mais la deuxième approche semble beaucoup plus efficace!



0
votes

Étant donné que toutes les commandes de JQuery ont une structure uniforme, il est vraiment facile d'utiliser n'importe quel objet (y compris les données JSON à partir d'une demande AJAX) en tant que commande JQuery

échantillon: xxx < p> est identique à

$ ("# échantillon '). ({" Titre ":" Je suis un exemple}};

http://jsfiddle.net/wb5ee/


0 commentaires

0
votes

Une alternative à LiveQuery tel qu'il me semblait obsolète car je ne pouvais pas le faire fonctionner:

https://github.com/bapplistudio/jquery.build

  • Vous devez déclarer toutes vos activations de jQuery dans * $ ("corps"). Build (fonction () {}); * déclarations
  • vous devez appeler $ ("newelement"). Build (); rappeler toutes vos fonctions d'initialisation.

    Regardez la documentation sur le site JQuery.build pour plus d'informations et d'exemples et de la démonstration en direct similaire à votre cas.

    http://saf.re/github/jquery.build/examples/ simple.html


0 commentaires