Использование нескольких форм в HTML

У меня есть четыре формы (MainForm, Landed, Apartment, Condominium) на одной HTML-странице.Использование нескольких форм в HTML

<body> 

     <form name="MainForm" method="post"> 
      <input type="radio" name="type" value="Landed">Landed 
      <input type="radio" name="type" value="Apartment">Apartment 
      <input type="radio" name="type" value="Condominium">Condominium 
     </form> 

     <form name="Landed" method="post"> </form> 

     <form name="Apartment" method="post"></form> 

     <form name="Condominium" method="post"></form> 
</body>

MainForm имеет три переключателя. Если нажата кнопка Landed, форма Landed будет загружена вместе с MainForm. Или другие переключатели выбраны, их соответствующие формы загружены. Прежде чем сделать какой-либо выбор, все формы скрыты. Затем отобразите только один раз, когда нажата радиокнопка. Что может быть лучшим для этого? Я попробовал, и все формы загружены вообще.

Благодаря

источник

2015-12-26 batuman

Что вы имеете в виду под 'загружен'? Вы хотите, чтобы вы получили HTML-код для них через AJAX, или просто чтобы они были показаны/скрыты на основе выбранной опции в '# MainForm'? Также обратите внимание, что ваш HTML недопустим - вы не можете иметь элементы вне '' –

@RoryMcCrossan Я просто хочу, чтобы формы показывались/скрывались на основе выбранной опции переключателей в #MainForm. Да, я знаю, я просто хочу показать, например. – batuman

@batuman: Если вы используете много html для веб-приложения, вы можете заинтересовать AngularJS. – Nico

Если все, что вы делаете, это показывает/скрывает форму, основанную на выбранной кнопки радио, вы можете использовать show и hide на основе id атрибутов form элементов, например:

<form id="mainform" name="mainform" method="post"> 
    <input type="radio" name="type" value="landed">Landed 
    <input type="radio" name="type" value="apartment">Apartment 
    <input type="radio" name="type" value="condominium">Condominium 
</form> 

<form id="landed" name="landed" method="post"> 
    Landed form 
</form> 

<form id="apartment" name="apartment" method="post"> 
    Apartment form 
</form> 

<form id="condominium" name="condominium" method="post"> 
    Condominium form 
</form>

$('#mainform input[type="radio"]').change(function() { 
    $('form:not(#mainform)').hide(); 
    $('#' + this.value).show(); 
});

Example fiddle

источник

2015-12-26 15:19:28

Приятное спасибо, позвольте мне проверить. – batuman

Использование нескольких форм в HTML

ответ

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