1

我正在尝试在共享点模式弹出窗口中显示 div 内容。下面是我的代码：

function callPopup(){
var options = SP.UI.$create_DialogOptions();
    options.html = addFilePopup //id of the div to be displayed
    options.title = 'Add file';
    options.width = 300;
    options.height = 150;
    SP.UI.ModalDialog.showModalDialog(options);
}

HTML：

<div id="addFilePopup" align="center" runat="server">
        <div id="buttons">
            <input type="file" id="file" name="file" />
        </div>
        <div id="divOverwrite" style="margin-right: 60px;">
            <input type="checkbox" id="chkOverWrite" value="overwrite" />
            <label id="lblOverwrite">Overwrite if file already exists</label>
        </div>
        <div style="margin-top: 40px;">
            <input type="button" value="Add file" id="btnAddFile" onclick="AddAFile();"/>
            <input type="button" value="Cancel" id="btnCancel" />
        </div>
</div>

弹出窗口第一次显示很好。但是如果函数 callPopup 被第二次调用，它会说“addFilePopup”是未定义的。第一次调用弹出窗口后，似乎从 DOM 中删除了 div“addFilePopup”。知道我在这里做错了什么吗？

PS：我尝试过为 div 使用和不使用“runat=server”。

4

2 回答 2

0

通常，当您克隆时，这应该是您最后的手段，因为它会带来很多副作用，例如双倍的 id。

我假设 callPopup() 是一个事件回调。假设您在按钮上的单击事件打开了这个弹出窗口，该弹出窗口反过来应该可视化已经加载到 DOM 的 html 代码。

   $('#addFilePopup').hide();

   function callPopup(){
      var options = SP.UI.$create_DialogOptions();
      options.html = addFilePopup //id of the div to be displayed
      options.title = 'Add file';
      options.width = 300;
      options.height = 150;
      SP.UI.ModalDialog.showModalDialog(options);
   }

这应该使您的 html 隐藏并同时加载到 DOM 中。当事件被触发时，您应该添加

 $('#addFilePopup').show();

您的代码应如下所示：

$('#addFilePopup').hide();
function callPopup(){
$('#addFilePopup').show();
  var options = SP.UI.$create_DialogOptions();
  options.html = addFilePopup //id of the div to be displayed
  options.title = 'Add file';
  options.width = 300;
  options.height = 150;
  SP.UI.ModalDialog.showModalDialog(options);

}

由于 options.html 必须接收 DOM 元素，这与 msdn 文档所述相反，这是我所知道的最简单的方法。我无法争辩它是否理想，但根据应用程序的复杂性，它可能会在 Sharepoint Popups 方面给出有效选项的提示。

PS我知道这是6年后，但如果有人遇到这个问题，希望能提供更好的解决方案。

于 2020-02-12T14:15:34.483 回答
-1

我是一个sharepoint新手，但我以前发生过这种情况。发生的情况是您使用的是原始 div 并且在您第一次调用后它确实被删除了。如果你仍然有这个问题，你可以使用 jQuery clone() 函数。

所以而不是 options.html = addFilePopUp

我建议先为您的 div 创建一个变量

var popUpDiv = $("div#addFilePopUp").clone();

然后调用你的选项

var options = SP.UI.$create_DialogOptions();
options.html = popUpDiv;
options.title = 'Add file';
options.width = 300;
options.height = 150;
SP.UI.ModalDialog.showModalDialog(options);

这将创建您的 div 的多个实例，因此您必须使用 css 隐藏原始实例。希望这可以帮助。

于 2013-10-23T15:08:52.533 回答