2015-10-12 60 views
0

我正在研究C#MVC 5應用程序。其中一頁尤其具有引導式手風琴風格的類別列表,每個類別都有一個隱藏的項目列表,這些項目在單擊該類別(展開)時顯示。這些組件(類別和項目)每個都在其旁邊有一個複選框。我已經實現了一些服務器端的巨無霸,當一個類別下的所有項目都被選中時,類別本身也被檢查。排序「檢查此類別中的所有項目」功能。我現在正在努力做這個客戶端;用戶檢查類別並自動檢查其下的所有項目。困難的部分是這些類別及其關聯的項目是根據應用程序在數據庫中找到的內容動態呈現的。從動態創建的組件監聽事件

E.g. (這只是一個樣本切片來說明我的問題)

@*some div stuff*@ 
@foreach (var category in Model.Categories) 
{ 
    @*here I have a way to get a unique id for this category*@ 
    @*some divs and headers go here*@ 
    @Html.CheckBoxFor(d => category.IsChecked) 
    @*some other headers like name, description, etc*@ 
    @*also code to handle the accordion-style collapsing/expanding*@ 

    @if (category.Items.Any()) 
    { 
    @*some div stuff here*@ 
    @foreach (var item in category.Items) 
    { 
     @*some div and header stuff here*@ 
     @Html.CheckBoxFor(d => item.IsChecked) 
     @*some other headers like name, description, etc*@ 
    } 
    } 
} 

簡而言之就是這樣。我知道我可以像添加IDS上述複選框:

@Html.CheckBoxFor(d => category.IsChecked, new {id = @categoryId}) 

其中的categoryId是該類別的唯一標識符,但是如同每種標識符是不同的,我無法弄清楚如何監聽其事件。

我需要某種形式的jQuery魔法,希望和祈禱!

我知道監聽複選框的變化使用:

$(document).on('change', '#someId', function(s, e) { 
     alert('alert!'); 
    }); 

但上述情況是傷害我的大腦,我不知道是什麼ID,並將該事件監聽器或種類喜歡它...

我敢肯定,有人在那裏遇到過類似的情況。我很缺乏經驗,不幸的是已經達到了我理解的邊緣。

最親切的問候

回答

1

動態添加的組件,如果你需要的事件連接到處理那麼事件就需要進行不同的處理,一個是您的頁面上的靜態組件,在這個組件上添加新組件。

這種類型的事件被稱爲委託事件。

$(document).on('change', '<selector>', function(event) { //process the event });

<selector>這裏應該是這將是新元素的父標籤元素的選擇。

更多信息可以在jquery論壇

參考中找到:http://api.jquery.com/on/

0

.on只對存在的項目現在。

如果你想將事件綁定到所有新創建的項目,則需要使用.delegate()