如何動態更改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模式數據 - 目標點擊

回答

相關問題