2016-09-19 4 views
0

У меня есть несколько наборов переключателей на моей странице. Каждый набор имеет две опции: «Текст» или «Загрузить изображение». Количество таких наборов динамически определяется и создается на веб-странице с помощью JQuery. Каждый из этих двух переключателей находится в одной форме.JQuery Radio Button Detect Changes

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

anstypeforms[i] = $('<form style = "padding:5px; margin:5px;">').attr('id', 
        function(){ 
         return 'AnsMethod'+quest[k].questionid; 
        }).appendTo($("#AnswerDiv"+quest[i].questionid)); 

где $ («# AnswerDiv» + квесты [я] .questionid некоторых <div>, который создается динамически квесты [я] .questionid является . номер

радио кнопки создаются следующим образом -

$('<input type="radio" name = "method" value = "TextMethod" checked = "checked" > Type Text </input>').appendTo(anstypeforms[i]); 
$('<input type="radio" name = "method" value = "ImageMethod" > Upload Image </input>').appendTo(anstypeforms[i]); 

Вот фрагмент кода, который пытается обнаружить изменения в любой из кнопок:

$(document).ready(function() { 
$("[id^='AnsMethod']").on('change', 'input[name=method]:radio', function(e) { 
    e.preventDefault(); 

.......do something...... 

}); 
}); 

Куда я иду не так?

+0

У Вас есть ошибка в вашем сгенерированном HTML. Входы не выглядят « текст'. –

ответ

0

После нескольких испытаний было принято работать с использованием окольного пути. Сначала я дал уникальное имя каждому из переключателей. Затем я обнаружил, что есть какие-либо изменения в любом переключателе. Затем было указано имя переключателя, который был изменен. Используя имя исходили с остальной частью коды -

$('<input type="radio" class="rbutton" value = "TextMethod" checked = "checked" > Type Text </input>').attr('name', function(){ 
              return 'method'+quest[k].questionid; 
              }).appendTo($("#AnswerDiv"+quest[i].questionid)); 
$('<input type="radio" class="rbutton" value = "ImageMethod" > Upload Image </input>').attr('name', function(){ 
              return 'method'+quest[k].questionid; 
              }).appendTo($("#AnswerDiv"+quest[i].questionid)); 

Вот идентификационный код -

$(document).on("change", 'input[type=radio]', function(e){ 
e.preventDefault(); 
var x = $(this).attr('name').substring(6); 
var y = $(this).attr('value'); 
switch(y) { 
    case 'TextMethod': 
     ....do something.... 
     break; 
    case 'ImageMethod': 
     ....do something.... 
     break; 
    } 
});