在另一个模态中调用javascript模态

时间:2012-10-26 09:27:04

标签: javascript jquery modal-dialog

我正在尝试将模态(即janrain给出的javascript函数)集成到已存在的模态中。我的网站在MVC架构中运行。我的屏幕上有很多标签,我正在为 tabs.htm 文件中的所有标签编写所有javascript函数。

单击一个选项卡后,它会在tabs.htm文件中调用javascript函数,然后调用特定html文件的ajax请求,然后在单击的选项卡中显示html的所有内容。

在A选项卡中说我有一个按钮,在onclick事件中,我在tabs.htm文件中调用javascript函数,然后从特定选项卡html文件调用模态,然后在选项卡中显示模式。

现在我需要添加下面显示的janrain给出的模态,在下面的另一个模态下面。

(function() {
    if (typeof window.janrain !== 'object') window.janrain = {};
    if (typeof window.janrain.settings !== 'object') window.janrain.settings = {};

    janrain.settings.tokenUrl = 'MY_URL';

    function isReady() { janrain.ready = true; };
    if (document.addEventListener) {
      document.addEventListener("DOMContentLoaded", isReady, false);
    } else {
      window.attachEvent('onload', isReady);
    }

    var e = document.createElement('script');
    e.type = 'text/javascript';
    e.id = 'janrainAuthWidget';

    if (document.location.protocol === 'https:') {
      e.src = 'https://rpxnow.com/js/lib/oauth/engage.js';
    } else {
      e.src = 'http://widget-cdn.rpxnow.com/js/lib/oauth/engage.js';
    }

    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(e, s);
})();

这是我在A的htm文件中按钮点击事件中调用的模态。

<div id="basic-modal-content">
<table width="100px" cellpadding="5" style="border-collapse:collapse;">
<tr>
<td width="140px">
Name     
</td>     
<input type="text" id="txtUserName" name="txtUserName" class="glow" style="width:150px;">
</td>
</tr>
<tr>
<td width="140px">
E-Mail ID
</td>
<td>
<input type="text" id="txtEmailQuest" name="txtEmailQuest" class="glow" style="width:150px;">
</td>
</tr>                 
</table>
<div style="text-align:center">
<input id="ask" type="image" src="/templates/default/images/askQuestion.jpg"  onClick="ValidateFormHere()"/>
</div> 

现在我想将javascript模式添加到此表单中。如果我在tabs.htm文件中保留了javascript模式,那么在调用此模态时我怎么称呼它。如果我将javascript文件粘贴到上面粘贴的模式中,则无法正常工作。希望我的问题很明确。

先谢谢。

1 个答案:

答案 0 :(得分:0)

维涅什。你想要做两件事:

1 - 转到https://rpxnow.com/relying_parties/your_rp_here,然后转到部署&gt;为Web登录。将您的窗口小部件类型设置为嵌入式(非模态),然后单击“保存并发布”。

2 - 在您希望按钮显示的表单中,添加以下代码行:

<div id="janrainEngageEmbed"></div>

导致该选项卡加载的JavaScript可能无法实际加载窗口小部件。如果发生这种情况,请在加载该选项卡的同一事件中调用janrain.engage.signin.widget.init()函数。它应该为您加载小部件。