如何动态更改bootstrap模式数据 - 目标点击

我有一个网站日历，其行为与预订请求类似。我曾在Bootstrap 2x中工作，但已将应用程序转换为3.0。一切似乎都在工作，但我正试图弄清楚如何动态更改数据目标。如何动态更改bootstrap模式数据 - 目标点击

如果日期是可用的，经过一天的日历可能是这样的：

<div id="20140226" data-id="20140226" class="NotRequested calDay" data-target="#modalDialog1" data-toggle="modal">26</div>

我有一个拉动的日子div的ID，并设置其工作要求的div id的演出活动精细。

$('#modalDialog1').on('show.bs.modal', function (e) { 
    $(e.target).data("id", $(e.relatedTarget).data("id")); 
}

在这种模式，一键发送的日期的请求，如果成功，交换类的div表明该日期已要求。

这是我的问题：在Bootstrap 2x中，我将取消绑定单击事件并重新绑定到新的单击事件。

在Bootstrap 3x中我试图更改数据目标。

dateElement.data("target", "#modalDialog2");

当我再次在这个日期点击，我得到的初始请求对话框中的“＃modalDialog1”代替＃modalDialog2

我也试图保持绑定/解除绑定代码，但是，它看起来像我将需要删除模态数据切换，因为它现在在请求日期后显示两个对话框。

我明显错过了一些东西。

如何动态更改数据目标，以便它将调用第二个对话框？

来源

2014-01-29 Paul Reedy

我知道这是旧的，所以我希望这是正确的。

我相信我已经通过从请求modalDialog1获取id获取上述日期元素来解决此问题。

如果请求成功，则会更改css和click事件。

var dateElement = $("#" + $("#modalDialog1").data("id")); 
dateElement.removeClass("NotReceived"); 
dateElement.unbind('click');

然后设置新的CSS和目标

dateElement.addClass("Requested"); 
dateElement("target", "#modalDialog2");

然后点击事件绑定到一个新的功能，以显示dialog2

dateElement.bind('click', PromptDialog2Function);

来源

2014-11-03 22:23:42

在我下面简单的代码，在下拉列表决定了显示的对话框会

<select onchange="$('#btn').data('target', this.value)"> 
<option value="#dlg1">Dialog 1</option> 
<option value="#dlg2">Dialog 2</option> 
</select> 
<button id="btn" data-target="#dlg1" onclick="$($(this).data('target')).modal('show');"> 
    Show Dialog 
</button>

来源

2014-04-11 05:09:43 suco2007

如何动态更改bootstrap模式数据 - 目标点击

回答

相关问题