1

これは奇妙なものです。私はそのようなセットアップをしています。

<form id="main">
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <input type="submit" name="submit" value="Search">
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>

ここで、class = "required"を使用して#mainフォームの入力のみを検証しようとしていますが、フォーム内の2番目の#serachIngredientフォームでは、検証がまったく機能しません。

疑問に思われる場合： #searchIngredientフォームはajaxを使用して結果を返します。デザイン上、＃mainフォーム内にある必要があります。

jQuery検証は#searchIngredientフォームなしで機能することは知っていますが、追加し直すと、エラーなしで機能しなくなります。

提案された回避策またはヒントはありますか？

4

3 に答える 3

9

それは可能ではありません。ネストされたフォームはHTMLではサポートされていません。

内部フォームの開始タグは無視され、内部フォームの終了タグは代わりに外部フォームを終了し、送信ボタンをフォームの外に残します。

ページには好きなだけフォームを含めることができますが、相互にネストすることはできません。

于 2012-07-11T01:17:40.840 に答える
0

ネストされたフォームがHTMLでサポートされていないため、同じ問題が発生しますネストされたフォームは無視されますが、最初のネストされたフォームのみが無視されるように見えるため、jqueryフォームの検証では、メインフォームの後にネストされたフォームを追加してからフォームを追加しました検証したいのですが、正常に動作します。

<form id="main">
<form>
</from>
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <input type="submit" name="submit" value="Search">
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>
于 2015-07-18T19:58:35.617 に答える
-2

私は同じ問題を抱えていました、私の解決策は（ネストされたフォームなしではできないので）次のとおりです：

<form id="main">
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <a href="#" class="submit-link"></a>
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>

次に、クラスの送信をフックして、ajaxの処理を実行します

$(document).on('click', 'form a.submit-link', function(e){
  e.preventDefault();
  var form = $(this).parents('form').first();
  var search = form.find('input[name="search"]').val();
  jQuery.post('my_ajax_url.php', {search: search)}, function(data, status, xhr) {
    // deal response
  });
});
于 2014-05-07T15:14:28.967 に答える