用jQuery對話框創建textarea

Question

我想在我的按鈕附近的特定位置創建一個textarea。繼承人的當前代碼：

var test = $('.content-dialog').dialog({ 
    width: '98%', 
    height: $(window).height() - 20, 
    position: ['top', 10], 
    resizable: true, 
    resize: function(evt, ui) { 
    CKEDITOR.instances['content[content]'].resize(
     $(this).width() - 5, 
     $(this).height() - 10 
    ); 
    }, 
    close: function(){ 
    $('span[id="cke_content[content]"]').remove(); 
    }, 
    buttons: [ 
    { 
     text: 'Save', 
     'class': 'green', 
     id: 'content_save', 
     click: function(){ 
     log_dlg.dialog('open'); 
     } 
    }, 
    { 
     text: 'Cancel', 
     click: function() { 
     $('.content-dialog').dialog('close'); 
     } 
    } 
    ] 
}); 

如何創建在其中創建的按鈕在同一容器中一個文本字段或只是一個文本框？

Answer 1

據我所知，使用對話框，我總是用作現有html的「decoraror」。

所以裝潢下面的代碼爲對話框你已經一個表格文本區域爲對話框：

<div class='content-dialog' style='display: none'> 
<form action='index.php' method="GET"> 
your text area 
<textarea> 
some text 
</textarea> 
</form> 
</div> 

加上commment

正如你可以enter link description here按鈕容器看到：

.ui-dialog-buttonpane

所以（見招行）（代碼是未經測試）：

<!-- dialog hook --> 
<div class='content-dialog' style='display: none'> 
</div> 


<!-- textarea code --> 
<div id='textareacode' style='display: none'> 
<form action='index.php' method="GET"> 
your text area 
<textarea> 
some text 
</textarea> 
</form> 
</div> 


<script type="text/javascript"> 
var test = $('.content-dialog').dialog({ 
    width: '98%', 
    height: $(window).height() - 20, 
    position: ['top', 10], 
    resizable: true, 
    resize: function(evt, ui) { 
    CKEDITOR.instances['content[content]'].resize(
     $(this).width() - 5, 
     $(this).height() - 10 
    ); 
    }, 
    close: function(){ 
    $('span[id="cke_content[content]"]').remove(); 
    }, 
    buttons: [ 
    { 
     text: 'Save', 
     'class': 'green', 
     id: 'content_save', 
     click: function(){ 
     log_dlg.dialog('open'); 
     } 
    }, 
    { 
     text: 'Cancel', 
     click: function() { 
     $('.content-dialog').dialog('close'); 
     } 
    } 
    ] 
}); 

// here the trick 
$('.content-dialog .ui-dialog-buttonpane').append($('#textareacode').text()) 

</script>