모달 대화 상자에 데이터 추가

Question

모달 대화 상자로 작업하고 있습니다. 모달 대화 상자의 양식에서 데이터를 입력 할 수 있습니까? 텍스트 상자 값 또는 드롭 다운 목록 값과 같은 값? 내가 어떻게 할 수 있니?

모달 대화 코드 :

var isConfirmed = false; 
       $('form').submit(function(e) { 
        var dialog = $("#dialog"); 
        if ($("#dialog").length == 0) { 
         dialog = $('<div id="dialog" style="display:hidden"> Los datos ingresados son:</div>').appendTo('body'); 
        } 
        dialog.load(

         $("#dialog").dialog({ 
          close: function(event, ui) { 
           dialog.remove(); 
          }, 
          resizable: false, 
          //height: 140, 
          //width: 460 
          modal: true, 
          buttons: { 
           "Ok": function() { 
            $(this).dialog("close"); 
            isConfirmed = true; 
            $("form").submit(); 
           }, 
           Cancel: function() { 
            $(this).dialog("close"); 
           } 
          } 
         }) 
        ); 
        if (isConfirmed) 
         return true; 
        else { 
         e.preventDefault(); 
         return false; 
        } 
       }); 

Answer 1

사용

dialog.data('yourDataKey', 'yourData') 

하고 대화 방법은 몇 가지의 요소에 부착되어 있기 때문에 대화 상자가

if (dialog.length == 0) { 
    dialog = $('<div id="dialog" style="display:hidden"> Los datos ingresados son:</div>').appendTo('body'); 
} 

Answer 2

에있는 경우 수표를 변경 정렬 - 일반적으로 div - 원하는 div를 div에 배치 할 수 있습니다. 다음은 문서의 예입니다.

<script> 
$(function() { 
    $("#dialog").dialog(); 
}); 
</script> 



<div class="demo"> 

<div id="dialog" title="Basic dialog"> 
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
</div> 

단락은 메서드에 바인딩 된 div에 있습니다.

Answer 3

현재 대화 상자를 페이지에 추가하는 것과 동일한 절차를 사용하십시오. 당신이 사용하고 :

이

dialog = $('<div id="dialog" style="display:none"> Los datos ingresados son:</div>').appendTo('body'); 

(참고 :.. 당신이 잘못되는 display:none로 변경 위, display:hidden를 사용했다)

마찬가지로, 당신은이 작업을 수행 할 수 있습니다

$('<div id="dialog_content">Whatever you want inside the dialog</div>').appendTo(dialog);