Problème de dialogue Jquery

Question

Salut tout le monde Je développe une application MVC, et je veux utiliser la boîte de dialogue Jquery. J'ai le scénario suivant: J'ai l'arborescence Telerik, et quand je clique sur un nœud, je veux que la boîte de dialogue s'ouvre et affiche des informations sur ce nœud. Tout d'abord j'ajouter le script suivant pour initialiser la boîte de dialogue:

$(document).ready(function() { 
     $("#dialog").dialog("destroy"); 
     $("#dialog-form").dialog({ 
      autoOpen: false, 
      height: 500, 
      width: 500, 
      modal: true, 
      buttons: { 
       Cancel: function() { 
        $(this).dialog('close'); 
       } 
      } 
     }); 
    }); 

puis a écrit le code suivant dans OnSelect (événement client de Telerik)

 $('#dialog-form').dialog('open'); 
     $('#dialog-form').load('<%= Url.Action("SomeAction", "SomeController") %>'); 

dans ma page principale i ont ajouté les fichiers de script sont nécessaires pour faire le travail modal comme celui-ci:

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.dialog.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.core.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.widget.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.button.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.draggable.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.position.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.resizable.js") %>"></script> 

et quand je clique sur les nœuds de rien d'arbre happed les outils de développement de chrome montrent la f erreur uite:

Uncaught TypeError: # objet n'a pas de méthode « dialogue »

il semble qu'il y ait une erreur d'enregistrement de script ou quelque chose comme ça

toute aide à ce

Answer 1

Problème résolu ... lorsque vous souhaitez utiliser des composants Telerik dans vos vues, vous devez enregistrer vos scripts avec le gestionnaire de script comme ceci:

<% Html.Telerik().ScriptRegistrar().DefaultGroup(group => group 
    .Add("jquery-1.4.2.js") 
    .Add("jquery.ui.core.js") 
    .Add("jquery.ui.widget.js") 
    .Add("jquery.ui.mouse.js")  
    .Add("jquery.ui.draggable.js") 
    .Add("jquery.ui.button.js")  
    .Add("jquery.ui.resizable.js") 
    .Add("jquery.ui.dialog.js") 
    .Add("jquery.ui.position.js") 

);
%>

Cordialement

Answer 2

Vous « re besoin d'ajuster l'ordre de dépendance il est donc correct, il devrait être:

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.core.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.widget.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.mouse.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.draggable.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.button.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.position.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.resizable.js") %>"></script> 
<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.dialog.js") %>"></script> 

Notez l'ajout deui.mouse.

---

Mais ... une approche beaucoup plus simple serait juste d'inclure jQuery UI comme un seul fichier, si vous utilisez tous les composants, il est plus simple, plus facile à mettre à jour et moins de requêtes HTTP, par exemple:

<script type="text/javascript" src="<%: Url.Content("~/Scripts/jquery.ui.js") %>"></script> 

Vous pouvez télécharger la bibliothèque comme un seul fichier ici: jQuery UI Download.

ou d'un CDN, par exemple la dernière (en date du moment de cette réponse) de Google:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script> 

Pour les prestations (ils sont très semblables aux avantages comprennent jQuery lui-même du CDN) see this question.