2010-02-24 6 views
0

je la page ASPX test suivant:Dialog jQuery UI ne fonctionne pas sur ASP.NET

<head runat="server"> 
    <title></title> 
    <script src="js/jquery-1.2.6.min.js" type="text/javascript"></script> 
    <script src="js/jquery-ui-1.6.custom.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 

      var dlg = $("#dialog").dialog({ 
       bgiframe: true, 
       autoOpen: false, 
       height: 300, 
       modal: true, 
       buttons: { 
        'Ok': function() { 
         __doPostBack('TreeNew', ''); 
         $(this).dialog('close'); 
        }, 
        Cancel: function() { 
         $(this).dialog('close'); 
        } 
       }, 
       close: function() { 
        dlg.parent().appendTo(jQuery('form:first')); 
       } 
      }); 
     }); 
     function ShowDialog() { 
      $('#dialog').dialog('open'); 
     } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:Button ID="TreeNew" runat="server" Text="New" 
      OnClientClick="ShowDialog();return false;" onclick="TreeNew_Click"/> 
     <asp:Label ID="Message" runat="server"></asp:Label> 
     <div id="dialog" title="Select content type"> 
      <p id="validateTips">All form fields are required.</p> 
      <asp:RadioButtonList ID="ContentTypeList" runat="server"> 
       <asp:ListItem Value="1">Texte</asp:ListItem> 
       <asp:ListItem Value="2">Image</asp:ListItem> 
       <asp:ListItem Value="3">Audio</asp:ListItem> 
       <asp:ListItem Value="4">Video</asp:ListItem> 
     </asp:RadioButtonList> 
     </div> 
    </div> 
    </form> 
</body> 
</html> 

J'utilise dlg.parent().appendTo(jQuery('form:first')); sur fonction près pour récupérer les valeurs de RadioButtonList.

Cela fonctionne bien, mais avant la page faire le PostBack le div "Dialog" se déplace sous le bouton Nouveau. Pourquoi?

Répondre

2

Je pense que cela est dû au fait que vous appelez:..

dlg.parent().appendTo(jQuery('form:first')); 

au rappel proche Ceci déplacera la boîte de dialogue Pourquoi appelez-vous pas immédiatement après avoir créé la di un journal?

+0

Parce que si je l'appelle immédiatement après la création du dialogue, je vois tout le temps le dialogue. – VansFannel

+0

Si vous avez défini autoOpen sur false (comme vous l'avez fait), vous ne devriez pas voir la boîte de dialogue. Vous devez appeler $ ("# dialog"). Dialog() puis dlg.parent(). AppendTo. Si la boîte de dialogue est toujours ouverte, vérifiez que tous les fichiers js et css sont correctement inclus. – kgiannakakis

+0

J'ai trouvé le problème. Il s'agit de la version de jQuery. Comme vous pouvez le voir dans la question, j'ai utilisé jquery-1.2.6.min.js et jquery-ui-1.6.custom.min.js. J'ai changé pour jquery-1.3.2.min.js et jquery-ui-1.7.2.custom.min.js et j'ajoute aussi une fonction ouverte sur le dialogue: open: function (type, data) {$ (this) .parent(). appendTo ("form");} et ça marche !!! – VansFannel

0

essayer chaning $ (function() { à $ (document) .ready (function() {

vérifier aussi où il échoue avec une sorte de javascript opera débogueur se est builtin et FireFox a Firebug. .

+0

Ça ne marche pas. Je n'ai trouvé aucune erreur. – VansFannel