您的位置:首页 > 产品设计 > UI/UE

SharePoint 2010 使用SP.UI.ModalDialog.showModalDialog(options)对话框框架传值

2013-02-22 09:37 561 查看


如图,主页面叫BasePage.aspx,被弹出的页面叫popupForm.aspx,弹出窗口的代码是:

var options = {
url: ‘popupForm.aspx’,
args: null,
title: ‘Select Value’,
dialogReturnValueCallback: dialogCallback
};
SP.UI.ModalDialog.showModalDialog(options);


其中dialogCallback是回调函数。可以参考http://msdn.microsoft.com/en-us/library/ff410058.aspx

那么如何在两个页面之间传值呢?

一.由BasePage.aspx页面向popupForm.aspx传值。

1,最典型的就是使用GET方法传递

var options = {
url: ‘popupForm.aspx?itemID=7′,
args: null,
title: ‘Select Value’,
dialogReturnValueCallback: dialogCallback
};
SP.UI.ModalDialog.showModalDialog(options);


接收方法:需要在popupForm.aspx后台接收,c#代码如下:

int itemID = Convert.ToInt32(Request.QueryString["ItemID"]);


2.使用options中的参数,将弹出窗口代码改写如下:

var options = {
url: ‘popupForm.aspx’,
args: 7,
title: ‘Select Value’,
dialogReturnValueCallback: dialogCallback
};
SP.UI.ModalDialog.showModalDialog(options);


在popuForm.aspx后台接收方法,这里就不再需要用后台代码了,js即可,代码如下:

var itemID = window.frameElement.dialogArgs;


二,向BasePage.aspx页面传回值。

首先,先看一下上面的回调函数dialogCallback的常见代码:

function dialogCallback (dialogResult, returnValue) {
if(dialogResult == SP.UI.DialogResult.ok){
// The user clicked the OK button.
// handle commitPopup

} else{

// The user clicked the Cancel button.
// handle cancelPopup
}
}


关闭弹出窗口的页面有三种方法可以调用:

1. window.frameElement.cancelPopUp(),调用该方法,将关闭窗口。返回值result是:SP.UI.DialogResult.cancel

2. window.frameElement.commitPopup(),调用该方法,将关闭窗口。返回值result是:SP.UI.DialogResult.ok

3. window.frameElement.commonModalDialogClose(),同上,不过返回值是指定的第一个参数。

上面三个方法如有疑问,可以msdn查询。注意红色标注的U的大小写区分。

下面是传回值的示例代码

1,如果是想使用c#实现,注意传回的值是数字7:

private void CloseDialog()
{
  string response = string.Format(“<script type=’text/javascript’>window.frameElement.commitPopup(\”{0}\”);</script>”, 7);
  Context.Response.Flush();
  Context.Response.End();
}


2.如果想使用js实现,传回值的值依然是数字7:

<script type=’text/javascript’>window.frameElement.commitPopup(“7”);</script>

下面是BasePage.aspx的接收方法:接收返回值7,并弹出。

function dialogCallback (dialogResult, returnValue)
{
if (returnValue != null) {
alert(returnValue);//弹出窗口
}
return;
}


原文参考:http://www.sharepointdevelopment.me/2011/06/passing-data-to-and-from-sharepoint-modal-dialogs/

http://www.chakkaradeep.com/post/Using-the-SharePoint-2010-Modal-Dialog.aspx

下面是一个实例代码(只是觉得能够给人启发):利用jQuery,将主页面内文本框的值,传递给弹出窗口并绑定到label上

function DisplayDialog() {
  var options = {
  url: ‘PopupFormExample.aspx’,
  args: $(‘#txtInput’).val(),
  title: ‘Select Value’,
  dialogReturnValueCallback: callbackMethod
  };
  SP.UI.ModalDialog.showModalDialog(options);
}


使用label接收参数

$(“span[id$='lblOutput']“).html(window.frameElement.dialogArgs);


转载:/article/5306140.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐