AngularJS вложен из, кнопка отправки не работает

У меня есть внешняя форма, которая после отправки будет отправлять пользователя на следующий шаг. Внутренняя форма отправляет поисковые запросы для таблицы, вложенной во внешнюю форму. На данный момент мое решение не запускает ни одну из двух форм.

<form id="outerForm" onsubmit="submitOuter()">
    <form id="innerForm" onsubmit="submitInner()">
        <button type="submit" form="innerForm">Search</button>
    </form>

    <button type="submit" form="outerForm">Next Step</button>
</form>

jsfiddle здесь

PS мой пример, очевидно, не использует AngularJS, разница в том, что в моих формах есть data-ng-submit.


forms html angularjs angularjs-forms
person Anton Belev    schedule 23.09.2015    source источник
comment
элементы формы не должны быть вложенными. Дополнительная информация   -  person Robert    schedule 23.09.2015

Ответы (3)


arrow_upward
1
arrow_downward

У вас не может быть вложенной формы в HTML, но angular дает возможность их вложить. Для реализации того же нужно использовать директиву ng-form.

Внешняя форма будет иметь ng-submit событие, но внутренняя форма будет иметь ng-click событие с кнопкой type="button", если вы не измените тип кнопки, она вызовет метод ng-submit родительской формы.

Демо-скрипт

ng-submit директива работает только с элементом form, поэтому вы необходимо указать тег form для внешней формы, так как вы хотите, чтобы там было ng-submit.

person Pankaj Parkar    schedule 23.09.2015

arrow_upward
0
arrow_downward

Формы никогда не должны быть вложенными, действительно ли вы используете Angular в своем приложении? Если да, то не могли бы вы рассказать о том, чего вы пытаетесь достичь.

person cullimorer    schedule 23.09.2015

arrow_upward
0
arrow_downward

Вложение элементов формы недопустимо, см. этот вопрос.

Я предлагаю вам использовать ng-click для type="button" ввода во внутренней части вашей формы, которая обрабатывает поиск, и ng-submit для внешней.

Я изменил пример плунжера в angular docs на ngSubmit, чтобы показать вам, что я имею в виду.

person Kevin Dreßler    schedule 23.09.2015