jQuery UI dialog problème
Je suis en train de créer jquery boîte de dialogue, mais il ne sert à rien 🙁
voici mon code jQuery:
$(document).ready(function() {
createDialog();
});
function createDialog() {
$("#dialog:ui-dialog").dialog("destroy");
$("#dialog-form").dialog(
{
autoOpen : false,
height : 475,
width : 350,
modal : true,
buttons : {
"submit" : function() {
var bValid = true;
allFields.removeClass("ui-state-error");
postText();
$(this).dialog("close");
}
},
cancel : function() {
$(this).dialog("close");
}
},
close : function() {
allFields.val("").removeClass("ui-state-error");
}
});
$(".add-org").click(function() {
$("#dialog-form").dialog("open");
});
}
voici le code html:
<link href="<c:url value="/resources/styles/jquery-ui-1.8.21.custom.css"/>"
rel="stylesheet" type="text/css">
<script type="text/javascript"
src="<c:url value='/resources/js/jquery-1.7.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/resources/js/jquery-ui-1.8.21.custom.min.js'/>"></script>
<script type="text/javascript"
src="<c:url value='/resources/js/myScript.js'/>"></script>
<a href="javascript:void(0)" class="add-org">New </a>
<div id="dialog-form" title="Add New ">
<p class="validateTips">All form fields are required.</p>
<form>
..................
</form>
</div>
et firebug dit:
TypeError: $("#dialog:ui-dialog").boîte de dialogue n'est pas une fonction
$("#dialog:ui-dialog").la boîte de dialogue("détruire");
et sur ma page je vois tous les champs du formulaire.
alors, quel est mon problème?
- Avez-vous que l'intérieur du document prêt?
- est-ce que votre fichier js "jquery-ui-1.8.21.custom.min.js" inclure le dialogue jquery plugin?
- la version de jquery utilisez-vous?
- voir les mises à jour, @allentranks, utilisé dans la recherche jquery-ui-1.8.21.custom.min.js fichier, - oui, il comprend
- cela fonctionne si vous commenter cette ligne $("#dialog:ui-dialog").la boîte de dialogue("détruire"); ?
- nope, il argumente avec les lignes à proximité : function() ` et
cancel : function()
- Je soupçonne il serait, depuis que la ligne est faux (voir ma réponse).
- c'est probablement juste un cas de la réparation de votre indentation et les parenthèses.
Vous devez vous connecter pour publier un commentaire.
Essayez ceci: de Travail démo http://jsfiddle.net/kEZkh/
Vous ne savez pas si votre source de chemin d'accès sont corrects, veuillez inclure les scripts suivants.
reste, n'hésitez pas à jouer avec la démo & j'espère que ça aide la cause
:)
scripts
code
:)
triés maintenant.Vérifier dans Firebug/DevTools si le fichier de script a été chargé avec succès. Si elle l'est, tapez ceci dans la console de Firebug, DevTools) ou mieux, la ligne où vos autres code est exécuté:
Si elle montre
undefined
, puis de jQuery UI n'a pas été chargé (encore). Vérifier si votre code s'exécute avant que le tout a été chargé, de le mettre à l'intérieur de jQuery$(document).prêt();
. Si c'est un objet, d'inspecter et de vérifier pour ladialog
propriété.Si vous avez configuré une version personnalisée sur jqueryui.com, de façon optimale si vous avez inclus la boîte de dialogue widget.
myScript.js
et vous avez certainement de la charge qu'après jQuery UI?La
destroy
appel doit être sur le même élément que vous avez déjà utilisé lors de la création de la boîte de dialogue, pas la.ui-dialog
conteneur qui obtient enroulé autour de votre contenu:Depuis votre code actuel est en train de lancer une exception, les lignes suivantes qui sont censés créer la boîte de dialogue jamais appelée.
Si vous voulez détruire chaque boîte de dialogue qui est peut-être déjà ouvert, jQuery UI se met un
.ui-dialog-content
classe dans chaque div du contenu: