jQuery colorbox打破了ASP.NET Web窗體中的回發
[英]jQuery colorbox breaks postbacks in ASP.NET Web Forms
問題描述
我們有一個Web窗體項目，在其中我想使用jQuery的colorbox插件彈出帶有提交按鈕的小窗口。 因為我們使用的是Web表單，所以form標簽不能是colorbox的一部分。 問題在於，當顏色盒將DOM中的元素加載到顏色盒中時，實際上會將其移到主體的頂部，成為絕對定位的元素。
通常，這很好，但是實際上會將內容從form標記中刪除。 這樣可以使顏色框中的提交按鈕不再引起回發。
這是代表問題的小提琴： http : //jsfiddle.net/Chevex/vbLFD/
如果單擊“提交更改”按鈕，您會注意到該表單已發布到google，並且該窗口已加載google。 但是，如果您單擊鏈接以將DIV加載到colorbox中，然后在colorbox中單擊“提交”按鈕，則不會發生任何事情。 該按鈕已從form標簽中取出。
是否有解決此問題的簡便方法？
編輯
我想到了用jQuery提交表單，如下所示： http : //jsfiddle.net/Chevex/vbLFD/6/
這樣做的問題是，如果DIV包含其他輸入元素，例如文本框，那么它們也將從表單標簽中刪除。 因此，即使表單是使用jQuery提交的，原本應該與表單一起發布的輸入值也不會包括在內。
似乎解決此問題的唯一方法是使顏色框以某種方式保留在表單中。
4 個解決方案
解決方案1
4 2014-02-04 14:54:14
我們正在使用Colorbox v1.4.33，應用接受的答案並不能解決問題。
Colorbox將創建兩個單獨的DIV元素，一個元素的ID = colorbox，另一個元素的ID = cboxOverlay。 您需要移動這兩個DIV元素，以便Colorbox對話框能夠正確呈現，並觸發ASP.NET回發。
$(function () {
$("#btnBoligforholdAdd").colorbox({
inline: true,
href: "#modalDialog_Boligforhold",
width: "450px",
closeButton: false,
opacity: 0.5,
onOpen: function () {
$('#aspnetForm').append($('#cboxOverlay'));
$('#aspnetForm').append($('#colorbox'));
}
});
});
解決方案2
3 已采納 2011-08-03 16:29:37
您可以使用一個簡單的jQuery塊將其移動到主窗體的頂部。
$(document).ready(function() {
var colorbox = $("#colorbox");
colorbox.remove(); // Removes from dom
$('form#idOfForm').prepend(colorbox);
});
現在，您在其中加載的所有內容都應該在全局窗體內 。
您可以使用的替代選擇器是body > form作為全局表單，但它的速度不如id。
解決方案3
0 2016-01-08 15:55:13
下方將打開一個2按鈕形式的顏色框，該顏色框允許將數據保存回到“保存”按鈕上后面的頁面。
1）實際的內聯表格
<div style="display: none;">
<div id="formcontent" class="form-horizontal padder">
<!--no <form> tag here as its inline content-->
</div>
</div>
2）Javascript
$(document).ready(function () {
$("#colorbox, #cboxOverlay").appendTo('form:first'); //required for colorbox forms!
$("#<%=cmdAdd.ClientID %>").colorbox({ inline: true, href: "#ColorBoxNewDiagram" });
$("#cmdNewDiagram").click(function () {
$.fn.colorbox.close();
});
$("#<%=cmdCancelAdd.ClientID%>").click(function () {
$.fn.colorbox.close();
return false;
});
});
解決方案4
0 2017-11-07 13:20:42
顏色框將隱藏的容器附加到<body>標簽，該標簽位於asp <form>標簽之外...
解決方法是：
附加到<form>標簽而不是<body>標簽
在jquery.colorbox.js文件中，搜索以下行：
$（document.body）.append（$ overlay，$ box.append（$ wrap，$ loadingBay））;
將其替換為以下行：
$（'form'）。prepend（$ overlay，$ box.append（$ wrap，$ loadingBay））;
ASP.Net 4.5 Web窗體路由會工作一段時間，然后中斷。 為什么？
[英]ASP.Net 4.5 Web Forms routing works for a while then breaks. Why?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.