Динамическая форма с JavaScript / PHP

Question

Хорошо, скажите, что у меня на странице, скажем, form.php. В этой форме скажите, что у меня есть флажки A, B и C. Что я хочу сделать, это когда вы нажимаете на флажок A, он показывает форму A, флажок B показывает форму B, а флажок C показывает форму c. Мне нужно, чтобы все было динамично, поэтому это происходит без перезагрузки страницы или чего-то подобного. Я бы предположил, что это будет использовать Jquery или Ajax. Я бы предпочел использовать Jquery только потому, что у меня есть небольшой опыт в этом, и мой сайт также уже использует технологию Jquery.

Answer 1

Не самая красивая реализация, но она указывает вам направление.

http://jsfiddle.net/73yuu/

Answer 2

Я знаю, что это старый пост, но я искал подобное решение, и я оказался здесь.

Я использовал ответ Оле Мелхуса в качестве отправной точки и сделал его немного красивее и полезнее для меня, используя switch / case вместо if / else. Просто подумал, что выложу это здесь для всех, кому это может понадобиться.

http://jsfiddle.net/N5rfu/

$("#for_form1, #for_form2, #for_form3").change(function(){
    switch($(this).attr('id')){
        case 'for_form1':
            $("#for_form2, #for_form3").attr('checked', '');
            $("#form2, #form3").hide(); 
            $("#form1").show();
            break;
        case 'for_form2':
            $("#for_form1, #for_form3").attr('checked', '');
            $("#form1, #form3").hide(); 
            $("#form2").show();
            break;   
        case 'for_form3':
            $("#for_form1, #for_form2").attr('checked', '');
            $("#form1, #form2").hide(); 
            $("#form3").show();   
            break;
    }

});

Answer 3

Что я хотел бы сделать, так это загрузить все 3 формы, имея их в своем собственном div и с style="display:none;" для всех трех.Когда пользователь нажимает на флажок (я бы использовал переключатели, если только одна форма могла отображаться одновременно), используйте jquery или что-либо еще, чтобы изменить значение отображения этого конкретного элемента, чтобы заблокировать.Вы также можете изменить классы для div, чтобы показать правильный div.