problema con diaglog basic modal

Holas, aquí conociendo el jquery, estoy probando con unas cajas de diálogo, funcionan pero no hace lo que se supone cuando tiene activado el modal:true, les dejo el código:

Código HTML :

$(function() {

  var options = {

    autoOpen: false,
    show: {   effect: "drop",   duration: 1000},
   hide: {   effect: "drop",   duration: 1000},
    modal: true,
    };

  $([1, 2, 3,]).each(function() {
    var num = this;
    var dlg = $('#dialog' + num)
      .dialog(options);
    $('#opener' + num).click(function() {
      dlg.dialog("open");
      return false;
    });
  });

});

que sucede aquí, pues como ven, tengo 3 div que funcionan a modo de botón (#opener) y estos muestran las cajas de diálogo (#dialog) en teoría no debería tener acceso a los otros botones, pero si puedo acceder a ellos, por consiguiente tengo 3 cajas montadas una encima de otra; en varios ejemplos que he visto, usando modal:true, lo que esta fuera de la caja debería estar desactivado por eso no se que estoy haciendo mal, Saludos!

Okay... dejame ver si entendi.. tienes 3 botones... y eldas clic a uno de ellos y sale el dialog... si mueves el dialog y le das clic a otro boton, sale otro dialog y asi sucesivamente ? (por eso 3 dialogs sobre puestos)

Hola!, pues sí, pero te detallo mejor, los tres botones están distribuidos en toda la pantalla, cuando le doy clic a uno de ellos aparece mi dialog, puedo moverlo si quiero, o cerrarlo, el hecho es que sin necesidad de moverlo puedo acceder a los otros botones y como no cerre al primer dialog, el segundo aparece encima del primero, puedo cerrar los dos, pero en orden inverso a como los llame, es decir, para cerrar dialog1 debo cerrar primero dialog2 , (nota: no puedo cerrarlos indistintamente) pero si puedo abrir el tercero sin problemas, mi idea era que no pueda abrir ningún otro botón sin que antes cierre el que abrí. gracias!

Hola espero ayudar, no se debe a que los dialogs tienen el mismo id(#), ya que por obvias razon jquery te esta cargando los dialogs con ese id(#), espero ser de ayuda, saludos

Hola, te explico los id(#) no son iguales, se llaman #dialog1, #dialog2, ... si te fijas en el scrip:

var dlg = $('#dialog' + num)

alli le estas agregando un numero, de esta manera puedes atender varios div con este código; efectivamente, tengo en total 17 divs (dialog1, diaglo2...) y todos los puedo abrir sin que se confundan, el problema que no se activa el modal:true, no quiero abrir todas las cajas a la vez porque se montan, quiero abrir una y obligar el usuario a cerrar la caja antes de abrir la otra.

Por otro lado he notado que si se desactivan los "input" que están en la pagina cuando activo una caja.
Saludos y se agradece la intensión.

Bueno se encontró la solución, por si a alguien le pasa lo mismo aqui la respuesta.

primero que nada se modifico es scrip y se agregaron estas lineas

$(function() {
var options = {
autoOpen: false,
show: { effect: "drop", duration: 300},
hide: { effect: "drop", duration: 300},
modal: true
};

$([1, 2, 3, 4,5,6,7,8,9,10,11,12,13,14,15,16,17]).each(function() {
var num = this;
var dlg = $('#dialog' + num)
.dialog(options);
$('#opener' + num).click(function() {
if($('#modal_activo').val()==0){// esta
dlg.dialog("open");
$('#modal_activo').val(1);//esta
return false;
} //esta
});
});

});
</script>

luego en dentro de body esta linea:

Código :

<input type="hidden" name="modal_activo" id="modal_activo" value="0"/>

y en el jquery-ui,js se agrego una linea debajo de la linea 9980

Código :

$('#modal_activo').val(0);

la solución no es de mi autoría pero igual lo comparto con la comunidad, saludos!!!