包括在jQueryUI的對話框形式的一部分

我有一些代碼如下所示：包括在jQueryUI的對話框形式的一部分

<form id="MyForm" name="MyForm" method="post" action="index.php"> 

<input type="text" id="Input1" name="Input1"> 
<input type="text" id="Input2" name="Input2"> 

<div id="dialog"> 
<input type="text" id="Input3" name="Input3"> 
<input type="text" id="Input4" name="Input4"> 
</div> 

<button type="button" onclick="$('#dialog').dialog('open');">Fill out 3 and 4</button> 
<input type="submit" value="Submit"> 

</form>

我可以把表格的第二部分在jQueryUI的對話框中，輸入3 &輸入4不會出現在發佈數據。是否有可能做到這一點？

來源

2010-02-26 Brian

編輯爲不指定輸入名稱。

$('#dialog').bind('dialogclose', function(event, ui) { 
    $('#dialog :input').each(function(index) { 

     $("#myForm").add('<input>').attr({ 
     type: 'hidden', 
     id: $(this).attr('id') 
     }); 
    }); 
});

來源

2010-03-03 02:15:07 macca1

我的例子非常簡化，我在兩個表格上都有一堆東西，包括文件。有沒有辦法做到這一點，而不列出每個輸入？ – Brian 2010-03-03 02:26:33

好的，我用更通用的方法更新它，所以它沒有列出每個輸入。這是僞代碼（也可能是準確的） - 沒有完全測試它，但這個想法應該起作用。 – macca1 2010-03-04 16:19:07

不適用於文件輸入，methinks。 – 2010-03-08 13:45:25

你的問題是，當你調用對話框上的DIV，該DIV從DOM脫離及復位在文件的結尾

如果你真的想（當時的形式外）一個jQuery對話框來處理這個問題，也許你可以嘗試從DOM中刪除對話框並將其放回到表單中。

所有的這是未經測試：

<form id="MyForm" name="MyForm" method="post" action="index.php"> 

<input type="text" id="Input1" name="Input1"> 
<input type="text" id="Input2" name="Input2"> 

<div id="hereismydialog"> 
<div id="dialog"> 
<input type="text" id="Input3" name="Input3"> 
<input type="text" id="Input4" name="Input4"> 
</div> 
</div> 


<button type="button" onclick="$('#dialog').dialog('open');">Fill out 3 and 4</button> 
<input type="submit" value="Submit"> 

</form>

當文檔準備好這樣做：

// prepares the dialog, that will remove it from its location in the document and 
// put it at the end 
$('#dialog').dialog({ autoOpen: false }); 

// put it back where it was 
$('#dialog').parent().detach().appendTo('#hereismydialog');

同樣，所有的這是未經測試，我想嘗試這與在螢火/ firequery準備。

來源

2010-03-05 12:14:40

Brian，您是否考慮過使用隱藏輸入字段，然後在對話框完成後更新隱藏字段？這將使您無需執行任何煩人的DOM操作。

來源

2010-03-05 18:37:51 Seaux

如果隱藏的輸入字段不是一個選項，那麼將事件處理程序添加到對話框的窗體（即實際輸入的重複項）中，以設置實際窗體的值？

如果您不想這樣做，因爲您不希望原始表單與對話框中的內容混淆在一起，那麼您可以將這些輸入抽出屏幕（即將其定位到遠處左圖，ala圖片替換）或將它們設置爲display:none（如果這樣做不會阻止瀏覽器提交它們的值）。當然你也可以使用hidden輸入來輸入簡單的輸入字段（文件上傳不能像這樣僞造）。

jQueryUI對話框的問題在於它們被撕掉了DOM，所以除非整個表單包含在其中，否則不能依賴它們的輸入。不過，你可以使他們的輸入像代理一樣。

來源

2010-03-08 13:44:51

這是一個有點難看，但你可以包含非對話框控件在一個單獨的DIV，攔截並提交他們追加使用。每個（）輪非對話框選擇，即將離任的帖子...

來源

2010-03-08 21:52:51 penderi

只需銷燬對話框並在關閉後移回所有內容。像這樣：

$("#trigger_link").click(function(event) { 
    // Dialog creation 
    $("div#form_part").dialog({autoOpen: false, buttons: {"OK": function() {$(this).dialog("close");}}}); 
    $("div#form_part").bind(
     'dialogclose', 
     function(event) { 
     $(this).dialog("destroy"); 
     $(this).appendTo("#form").hide(); 
     } 
    ); 
    // Displaying 
    $("#div#form_part").dialog('open'); 
    event.preventDefault(); 
    return false; 
    });

來源

2011-05-16 17:09:48 temochka

+1這爲我工作。謝謝！ – Laguna 2012-09-10 18:55:03

包括在jQueryUI的對話框形式的一部分

回答

相關問題