Cómo cambiar el tamaño del ancho de un diálogo de Jquery después de la inicialización

Question

Estoy intentando cambiar el ancho de un diálogo de JQuery después de que se haya inicializado. Aquí está mi inicialización:

$(function() { 
$("#dialogContainer").dialog({ 
title: 'Some title', 
resizable: false, 
bgiframe: true, 
overlay: { opacity: 0.3, background: "white" }, 
position: [200, 200], 
autoOpen: false, 
height: 150, 
width: 'auto' 
modal: true, 
buttons: { 
    'ok': function() { 
    $(this).dialog('close'); 
    } 
} 

});

});

y esto es lo que estoy haciendo para cambiar el ancho de la misma en alguna otra función:

$("#dialogBox").dialog('option','width',700); 

Pero esto no funciona. El ancho del diálogo es el ancho del párrafo que se muestra primero en él. ¿Se suponía que debía hacer algo más?

Aquí está el código HTML para el diálogo:

<div id = 'dialogContainer'> 
    <p id = 'message'></p> 
</div> 

Answer 1

Asegúrese de que está utilizando ui.resizable.js y ui.resizable.css

Answer 2

Prueba esto:

$("#dialogID").data("width.dialog", 160); 

Answer 3

$("#dialogID").css("width", 160); 

Answer 4

$("#dialogweb").dialog({width:'90%'}); 

Answer 5

HERE IS SHORT SOLUTION, Pero rememb er es solo para el diálogo predefinido.

$("#dialog").dialog({minHeight: 300,minWidth:500}); 

Answer 6

inicializar el diálogo con la opción anchura especificada: La anchura de la ventana de diálogo está en píxeles.

$("#dialogBox").dialog({ width: 500 }); 

obtener o establecer la opción de ancho, después de la inicialización:

// getter 
var width = $("#dialogBox").dialog("option", "width"); 

// setter 
$("#dialogBox").dialog("option", "width", 500); 

Fuente: http://api.jqueryui.com/dialog/

Answer 7

Esto funciona para mí. El punto es cambiar el tamaño después abrirlo:

$('#dialogContainer'). 
    dialog('open'). 
    dialog('option', 'width', 'auto'). 
    dialog('option', 'height', 'auto'); 

versión de jQuery en mi caso es 1.11:

> Query.fn.jquery 
> "1.11.1"