다시 열면 JQuery UI 대화 상자의 크기가 제대로 조정되지 않습니까?

여기 전문가의 도움이 필요합니다.다시 열면 JQuery UI 대화 상자의 크기가 제대로 조정되지 않습니까?

"Open"버튼을 클릭하면 코드가 멋지게 멋지게 작동합니다. 일단 날짜를 선택하면 잘 닫힙니다. 그러나 다시 두 번 다시 열면 너비와 높이가 범위를 벗어나 UI 대화 상자가 다르게 보입니다. 내가 여기서 뭘 잘못하고 있는지 궁금해?

<html> 

<head> 

<!-- LOAD JQUERY LIBRARY: --> 
    <link href="jq/jquery-ui.css"   type="text/css" rel="stylesheet" /> 
    <script src="jq/jquery.min.js"   type="text/javascript"> </script> 
    <script src="jq/jquery-ui.min.js"  type="text/javascript"> </script> 

<script type="text/javascript"> 
var z; 

function opendd() { 

    $('#dd').dialog({ 
     autoOpen: true, 
     modal:  true, 
     overlay: { opacity: 0.5, background: 'black'}, 
     title:  'Select the date:', 
     height:  215, 
     width:  234, 
     draggable: false, 
     resizable: false 

    });//end of dialog_atip 


    $("#B1").click(function(){ 
     callback(); 
    }); 

    $('#d1').datepicker({ 
    onSelect:function(){ 
        z = $(this).val(); 
        alert(z); 
        $("#dd").dialog("close"); 
    } 
    }); 

}//end of function 


function callback() { 
    alert(z); 
} 
</script> 


</head> 

<body> 
<a href="javascript:opendd()">open 
</a> 
<div style="display:none" id="dd"> 
<div id="d1"> 
</div> 

</div> 
<input type="button" value="CallbackValue" name="B1" id="B1"> 

</body> 

</html>

모든 도움과 도움을 주셔서 감사드립니다.

제이

출처

2012-08-29 Jason Kelly

너는 높이와 너비에 "자동"을 사용하려고 시도 했습니까? : http://stackoverflow.com/questions/2231446/automatically-resize-jquery-ui-dialog-to-the-width-of-the-content-loaded-by-ajax –

일관된 것 같습니다 (비록 혼잡 함) 여기 http : //jsfiddle.net/j08691/T8EcP/ – j08691

여기에 눈을 위해 너비가 변경되었습니다. http://jsfiddle.net/awPGV/ –

나는 당신의 설명 동작을 복제 할 수 없습니다, 그러나 당신의 문제를 해결할 수있는 jQuery를 권장 무엇에 대한보다 정확한 기능의 일부를 다시 작성했다.

아래 코드 블록에서 문서 준비가 완료되면 jQuery 모달 대화 상자를 인스턴스화 한 다음 매번 대화 상자 ('열기') 명령을 실행하여 열거 나 닫습니다. (테스트를 위해 Google API를 사용하여 라이브러리를 교체했습니다).

<html> 

<head> 

<!-- LOAD JQUERY LIBRARY: --> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.23/themes/base/jquery-ui.css" type="text/css" media="all" /><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script> 
<script type="text/javascript"> 
var z; 

$(document).ready(function() { 
    $('#dd').dialog({ 
     autoOpen: false, 
     modal:  true, 
     overlay: { opacity: 0.5, background: 'black'}, 
     title:  'Select the date:', 
     height:  215, 
     width:  234, 
     draggable: false, 
     resizable: false 

    });//end of dialog_atip 
    $("#B1").click(function(){ 
     callback(); 
    }); 
    $('#d1').datepicker({ 
     onSelect:function(){ 
        z = $(this).val(); 
        alert(z); 
        $("#dd").dialog("close"); 
     } 
    }); 
}); 


function opendd() { 
    $('#dd').dialog('open'); 
}//end of function 


function callback() { 
    alert(z); 
} 
</script> 


</head> 

<body> 
<a href="javascript:opendd()">open 
</a> 
<div style="display:none" id="dd"> 
<div id="d1"> 
</div> 

</div> 
<input type="button" value="CallbackValue" name="B1" id="B1"> 

</body> 

</html>

출처

2012-08-29 20:40:34

내가뿐만 아니라 당신의 문제를 재현 할 수 없습니다 :이 당신을 위해 작동하는지 알려주세요,하지만 당신이 그것을 얻는 유지하는 경우, 당신은 $("#dd").dialog().option("height", 215) 같은 것을 사용하시기 바랍니다. jquery dialog height option - setting height in runtime에서 자세한 내용을 읽어보십시오.

CSS 솔루션이 더 좋을까요?

당신은 autoOpen:true을 보았지만 사용하지 않았습니까? 이거 목적이 있니?

여기에 my JSFiddle입니다.

출처

2012-08-29 21:00:23

다시 열면 JQuery UI 대화 상자의 크기가 제대로 조정되지 않습니까?

답변

관련 문제