2010-03-29 3 views
1

у меня есть набор переключателей, которые генерируются динамически (с помощью JSON вызова):Использование JQuery с динамически добавляемых элементов управления (MVC)

StringBuilder sbEligAll = new StringBuilder(); 

sbEligAll.Append("<div id='currentselectiondepartment'>"); 
sbEligAll.Append(" <input type='radio' name='selectalldepartment' id='radCurrent' value='0' /><label for='radCurrent'>Current</label>"); 
sbEligAll.Append(" <input type='radio' name='selectalldepartment' id='radFuture' value='1' /><label for='radFuture'>Future</label>"); 
sbEligAll.Append(" <input type='radio' name='selectalldepartment' id='radCurrentAll' value='2' /><label for='radCurrentAll'>Current All</label>"); 
sbEligAll.Append(" <input type='radio' name='selectalldepartment' id='radFutureAll' value='3' /><label for='radFutureAll'>Future All</label>"); 
sbEligAll.Append("</div>"); 

Тогда:

return Json(new { TableList = sbElig.ToString() }, JsonRequestBehavior.AllowGet); 

Есть ли способ получить jQuery, чтобы иметь возможность взаимодействовать с ними?

Например:

$("input[name=selectalldepartment]").change(function() { 
    var str = $('input[name=selectalldepartment]:checked').val(); 
    $(".radiolist[value='" + str + "']").attr("checked", true); 
}); 

Я пробовал все, что я знаю, как это сделать, но JQuery как раз не огонь. (Я добавил предупреждения в код jQuery, чтобы узнать, действительно ли он вызван, и это не так).

Любые мысли ?!

Спасибо!

ответ

2

Использование .live() так:

$("input[name=selectalldepartment]").live('change', function() { 
    var str = $('input[name=selectalldepartment]:checked').val(); 
    $(".radiolist[value='" + str + "']").attr("checked", true); 
}); 

При запуске текущий код выглядит для этого селектора, и присоединяет обработчик событий к элементам ... новые элементы не были там пристроить, когда он был запущен. Другой вариант - когда вы добавляете элементы управления, добавляете обработчик туда к новым, соответствующим одному и тому же селектору в ответе, примерно так:

$.ajax({ 
    url: blah.aspx... 
    success: function(data) { 
     //do stuff 
     $("input[name=selectalldepartment]", data).change(function() { 
     //Code or a function to keep it tidy 
     }); 
    } 
}); 
+0

Блестящий. Спасибо за описание WHY, это не работает! Это определенно помогает мне в долгосрочной перспективе, когда я знаю, почему все работает или не работает, я, как правило, помню эти решения! Спасибо! – SlackerCoder

Смежные вопросы