Skip to main content

Search and Top Navigation

#4975 closed bug (wontfix)

Opened November 24, 2009 09:51PM UTC

Closed October 25, 2012 09:23AM UTC

Dialog: Cannot modify zIndex option after init

Reported by: betobaz Owned by:
Priority: major Milestone: 1.10.0
Component: ui.dialog Version: 1.7.2
Keywords: zIndex Cc:
Blocked by: Blocking:
Description

.dialog('option', 'zIndex', val) doesn't do anything if the dialog is already open.

Attachments (0)
Change History (14)

Changed January 15, 2010 12:18PM UTC by jzaefferer comment:1

Please provide the description in english.

Changed January 21, 2010 02:29AM UTC by scottgonzalez comment:2

description: Que tal, disculpen que escriba en español. He estado desarrollando con jQuery UI y encontre un problema con Widget Dialog. Al tratar de utilizar getter de zIndex una vez ya inicializado el Dialog no me respondia. \ [[BR]] \ El codigo con el que inicializo mi Dialog es el siguiente \ {{{ \ $('#divX') \ .dialog({ \ autoOpen: false, \ modal: true, \ resizable : false, \ buttons : { \ 'Aceptar' : function(){ \ eviaDatosFrm(); \ }, \ 'Cancelar' : function(){ \ $('#divX').dialog('close'); \ } \ }, \ close : function(event, ui){ \ limpiaFrm(); \ } \ \ }); \ }}} \ [[BR]] \ Una vez en pantalla el Dialog trate de ejecutar la siguiente instruccion, sin con seguir un resultado. \ [[BR]] \ \ {{{ \ $('divX').dialog('option', 'zIndex',100); \ }}} \ [[BR]] \ Busque dentro del codigo fuente del Dialog y encontre que en la funcion ''_setData'' no existe el case para "zIndex", con lo cual me vi en la necesidad de modificarlo, les envio la posible solucion. \ [[BR]] \ \ {{{ \ _setData: function(key, value){ \ (setDataSwitch[key] && this.uiDialog.data(setDataSwitch[key], value)); \ switch (key) { \ case "buttons": \ this._createButtons(value); \ break; \ case "closeText": \ this.uiDialogTitlebarCloseText.text(value); \ break; \ case "dialogClass": \ this.uiDialog \ .removeClass(this.options.dialogClass) \ .addClass(uiDialogClasses + value); \ break; \ case "draggable": \ (value \ ? this._makeDraggable() \ : this.uiDialog.draggable('destroy')); \ break; \ case "height": \ this.uiDialog.height(value); \ break; \ case "position": \ this._position(value); \ break; \ case "resizable": \ var uiDialog = this.uiDialog, \ isResizable = this.uiDialog.is(':data(resizable)'); \ \ // currently resizable, becoming non-resizable \ (isResizable && !value && uiDialog.resizable('destroy')); \ \ // currently resizable, changing handles \ (isResizable && typeof value == 'string' && \ uiDialog.resizable('option', 'handles', value)); \ \ // currently non-resizable, becoming resizable \ (isResizable || this._makeResizable(value)); \ break; \ case "title": \ $(".ui-dialog-title", this.uiDialogTitlebar).html(value || ' '); \ break; \ case "width": \ this.uiDialog.width(value); \ break; \ //------------------------------------------// \ //Se agregaron las siguiente lineas \ //------------------------------------------// \ case "zIndex": \ this.uiDialog.css("z-index",value); \ (this.overlay&&this.overlay.$el.css("z-index",--value)); \ break; \ //------------------------------------------// \ } \ \ $.widget.prototype._setData.apply(this, arguments); \ } \ }}} \ [[BR]] \ \ Cualquier duda o comentario estoy para servirles. \ \ .dialog('option', 'zIndex', val) doesn't do anything if the dialog is already open.
summary: Problema con dialog('option','zIndex',value), [Posible solucion]Dialog: Cannot modify zIndex option after init

Changed January 27, 2010 01:46PM UTC by rdworth comment:3

milestone: TBD1.8

Changed February 02, 2010 06:35PM UTC by betobaz comment:4

Sorry, i'm from Mexico and i don't speaking english very well. Using UI Dialog I find that zIndex allocation does not work, in jquery-ui-1.7.2.custom, the _setData function don't have the case for zIndex. The solution that i give is the follow:

case "zIndex":

this.uiDialog.css("z-index",value);

(this.overlay&&this.overlay.$el.css("z-index",--value));

break;

I hope that my contribution is helpfull

Changed November 08, 2010 03:16PM UTC by spudly comment:5

I would also like to see this fixed.

The problem seems to be that _setOption is defined in the dialog widget but "zIndex" is not in the switch statement. As a result, you can neither get nor set the zIndex of the dialog. I would say this is a feature, but the documentation says this should work.

In my case, I need to modify the zindex each time the dialog is opened to ensure it opens on top.

Changed June 07, 2011 02:35PM UTC by adovenmuehle comment:6

This issue seems to be fixed in 1.8.9, see http://jsfiddle.net/AVxGY/

Changed June 07, 2011 06:18PM UTC by rdworth comment:7

Replying to [comment:6 adovenmuehle]:

This issue seems to be fixed in 1.8.9, see http://jsfiddle.net/AVxGY/

Nope. Your test is only checking that the option has changed, not that the option change has actually had an effect on the ui-dialog element. See http://jsfiddle.net/rdworth/AVxGY/1/

Changed October 11, 2012 02:47PM UTC by scottgonzalez comment:8

milestone: 1.9.01.10.0

Changed October 15, 2012 08:05PM UTC by petersendidit comment:9

status: newopen

Changed October 16, 2012 04:07PM UTC by fontzter comment:10

owner: → fontzter
status: openassigned

Changed October 16, 2012 04:43PM UTC by fontzter comment:11

owner: fontzter
status: assignedopen

A more extensive example is here: http://jsfiddle.net/fontzter/qjeHT/2/

This will likely be resolved in the reworking of zIndex and modality.

A possible workaround is to add the following case to the switch within the _setOption:

case "zIndex":
	this.uiDialog.css( "z-index", value );
	this.options.zIndex = value;

	// maxZ needs to be reset if the dialog is opened
	if ( this._isOpen ) {
		this.moveToTop();
	}
	break;

Changed October 16, 2012 07:20PM UTC by bchiasson comment:12

owner: → bchiasson
status: openassigned

Changed October 16, 2012 07:33PM UTC by bchiasson comment:13

owner: bchiasson
status: assignedopen

Changed October 25, 2012 09:23AM UTC by scottgonzalez comment:14

resolution: → wontfix
status: openclosed