2012-02-03 26 views
6

El siguiente código produce el cuadro de diálogo emergente modal jQueryUI esperado en Firefox, Chrome y Opera. Sin embargo, se produce un error en Internet Explorer 9:¿Por qué este diálogo jQueryUI no funciona en IE9?

<html><head> 

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script> 

<script type="text/javascript"> 
$(function() { 
    $("#AddUser").dialog({ 
     autoOpen: false, modal: true, height: 'auto', width: 400, 
     buttons: { 
      "Add": function() { 
       alert("Add one!"); 
      } 
     }, 
     close: function() { 
      allFields.val("").removeClass("ui-state-error"); 
     } 
    }); 

    $("#AddUserButton").button().click(function(event) { 
     event.preventDefault(); 
     $("#AddUser").dialog("open"); 
    }); 


}); 
</script> 

</head><body> 

<div id="AddUser" title="Add User">Popup content here</div> 
<input type="submit" id="AddUserButton" /> 

</body></html> 

En IE 9 el div #AddUser no es un cuadro de diálogo jQueryUI. ¿Hay algo que me falta?

EDIT: Código actualizado para acercarse al código de producción.

Gracias.

+0

¿Qué error obtuvieron? –

+0

@NadirMuzaffar: El div es simple se muestra en la pantalla. – dotancohen

+0

¿Estás utilizando la versión jquery/jqueryui durada? – tcao

Respuesta

10

que es el problema de arrastre "" IE no le gusta

$("#AddUser").dialog({ 
        autoOpen: false, modal: true >>,<< 
      }); 

esto funcionará:

$("#AddUser").dialog({ 
        autoOpen: false, modal: true 
      }); 
+0

¡Gracias, eso lo arregla en el código que había publicado! Sin embargo, el código de producción tiene otras características y no tiene una coma al final. Actualicé el código en la pregunta. Gracias. – dotancohen

+1

¡Esto resultó ser un mundo de dolor! Sin embargo, me has superado el primer obstáculo. ¡Gracias! – dotancohen

+0

Muchas horas perdidas ... solo por una coma .... ¡Gracias! – Bidou

5

intenta agregar DOCTYPE en el archivo html. <!DOCTYPE HTML>

+0

Gracias, que de hecho fue _uno_ de los problemas. – dotancohen

1

Ok, esto es sólo una suposición, pero type = "submit" a veces es raro en decir ...

has necesitado: <button id="AddUserButton">AddUser</button>

también yo llamaría "preventDefault" en último acción dentro del oyente de acción.

+0

Gracias. Sin embargo, el problema ya se ha resuelto, y IE está bien con el código

0

Tuve el mismo problema con el diálogo y agregué el siguiente en el archivo css para hacer el trabajo por mí.

.ui-widget-overlay 
{ 
     z-index: 0 !important; 
} 
Cuestiones relacionadas