Returning Value from ASPxPopupControl

ASPxPopupControl 是 Developer Express 在 ASPxperience Suite 裡面所提供的 Web 控制項。你不僅可以利用它填入 HTML 內容外,也可以指定特定的網頁來為你的網頁加入快顯視窗功能。

當你使用 ASPxPopupControl 的 ContentUrl 屬性設定開啟網頁時,它會建立內嵌框架載入網頁內容。為了利於在內嵌網頁中傳遞值給主網頁及隱藏快顯視窗所需的物件參考,需在其 init 事件加入必要的初始化程式碼。
<%@ Page Language="C#" AutoEventWireup="true" %>
<html>
<head runat="server">
<title>Returning Value from ASPxPopupControl</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="0">
<tr>
<td>
<dx:ASPxTextBox ID="supplierTextBox" runat="server"
ClientInstanceName="supplierTextBox" Width="80" />
</td>
<td>
<dx:ASPxButton ID="popupButton" runat="server" Text="..." />
</td>
</tr>
</table>
<dx:ASPxPopupControl ID="suppliersPopup" runat="server"
ClientInstanceName="suppliersPopup" AllowDragging="True"
AllowResize="True" CloseAction="CloseButton"
ContentUrl="SlavePage.aspx" Width="400" Height="450"
ContentStyle-Paddings-Padding="2" HeaderText="Select Supplier"
PopupElementID="popupButton">
<ClientSideEvents Init="function(s, e) {
var iframe = s.GetContentIFrame();
iframe.contentLoaded = false;
var controlCollection = ASPxClientControl.GetControlCollection();
iframe.popupArguments = {
popupContainer: controlCollection.Get('suppliersPopup'),
controlToAssign: controlCollection.Get('supplierTextBox')
};
}"></ClientSideEvents>
</dx:ASPxPopupControl>
</div>
</form>
</body>
</html>

以下程式碼示範如何在內嵌框架頁面中傳值給主網頁並隱藏快顯視窗:
<%@ Page Language="C#" AutoEventWireup="true" %>
<html>
<head runat="server">
<title>Select Supplier</title>
<script type="text/javascript">
function getOuterFrame() {
var iframes = window.parent.document.getElementsByTagName("iframe");
for (var i = 0, len = iframes.length; i < len; i++) {
var doc = iframes[i].contentDocument || iframes[i].contentWindow.document;
if (doc === document) {
return iframes[i];
}
}
return null;
}
function hidePopupWindow() {
var outerFrame = getOuterFrame();
if (outerFrame !== null) {
outerFrame.popupArguments.popupContainer.Hide();
}
}
function setReturnValue(v) {
var outerFrame = getOuterFrame();
if (outerFrame !== null) {
var controlToAssign = outerFrame.popupArguments.controlToAssign;
if (controlToAssign) {
controlToAssign.SetText(v);
}
}
hidePopupWindow();
}
</script>
<script runat="server">
void OkButton_Click(object sender, EventArgs e)
{
if (grid.FocusedRowIndex > -1)
{
object key = grid.GetRowValues(grid.FocusedRowIndex, grid.KeyFieldName);
Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
"SetReturnValue", "setReturnValue('" + key.ToString() + @"');
", true);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxGridView ID="grid" runat="server"
ClientInstanceName="grid" DataSourceID="NorthwindDataSource"
KeyFieldName="SupplierID" AutoGenerateColumns="false" Width="100%">
<Columns>
<dx:GridViewDataCheckColumn>
<DataItemTemplate>
<input type="radio" name="radioButton" />
</DataItemTemplate>
</dx:GridViewDataCheckColumn>
<dx:GridViewDataColumn FieldName="CompanyName" Caption="Company Name" />
<dx:GridViewDataColumn FieldName="ContactName" Caption="Contact Name" />
</Columns>
<SettingsBehavior AllowFocusedRow="True" />
<ClientSideEvents FocusedRowChanged="function(s, e) {
var row = s.GetRow(s.GetFocusedRowIndex());
if(__aspxIE)
row.cells[0].childNodes[0].checked = true;
else
row.cells[0].childNodes[1].checked = true;
}" />
</dx:ASPxGridView>
<br />
<table border="0" align="center">
<tr>
<td>
<dx:ASPxButton ID="OkButton" runat="server" Text="OK"
OnClick="OkButton_Click" />
</td>
<td>
<dx:ASPxButton ID="CancelButton" runat="server" Text="Cancel">
<ClientSideEvents Click="function(s, e) {
hidePopupWindow();
}" />
</dx:ASPxButton>
</td>
</tr>
</table>
<asp:AccessDataSource ID="NorthwindDataSource" runat="server"
DataFile="~/App_Data/Northwind.mdb"
SelectCommand="SELECT * FROM Suppliers"></asp:AccessDataSource>
</div>
</form>
</body>
</html>

Download sample code


Share/Save/Bookmark

0 comments :: Returning Value from ASPxPopupControl

張貼留言