0

jqueryui.com/tabs/#のように、タブ付きインデックスの同じページに 2 つのフォームがあります。

私はjsファイルを含めました:

jquery.validate.js、追加のメソッド.js、jquery.js

最初のタブのフォーム:

<form action="#" method="post" accept-charset="utf-8" name="org" id="org" autocomplete="off">         
  <table border="0" cellpadding="4" cellspacing="0">
    <tr>
       <td> <label>Name: </label></td>
       <td><input type="text" name="head" value="" id="head" class="required"  /></td>
    </tr>
    <tr>
      <td><label></label></td>
      <td><input type="submit" name="Submit" value="Add" onclick="javascript:addForm();" /></td>
    </tr>
  </table>
</form>

2 番目の TAB のフォーム:

 <form action="" method="post" accept-charset="utf-8" name="orgEdit" id="orgEdit" autocomplete="off">
   <table border="0" cellpadding="4" cellspacing="0">
     <tr>
       <td><label>Head: </label></td>
       <td><input type="text" name="editHead" value="" id="editHead" class="required"  /></td>
     </tr>
     <tr>
        <td><label></label></td>
        <td><input type="submit" name="Submit" value="Update" onclick="javascript:editForm();" /></td>
     </tr>
   </table>
 </form>

これら2つのフォームの送信ボタンをクリックしたときの検証部分は次のとおりです。

<script>
function addForm() {
    $("#org").validate({
        rules: {
            head: {
                required:true,
                letterswithbasicpunc:true
            },
        },
        messages: { 
            head: {
                required:"&nbsp;Please enter head name.",
                letterswithbasicpunc:"&nbsp;Please enter only characters."
            },
        },
        submitHandler: function(form) {
            $.post("url",$("#org").serialize(),function(data){ 
                if(data != 'E') {
                    alert("Data Inserted Successfully.");
                    location.reload();
                } else
                    alert("Failed.");
            });
        }
    });
}

function editForm() {
    $("#orgEdit").validate({ 
        rules: {
            editHead: {
                required:true,
                letterswithbasicpunc:true
            },
        },
        messages: { 
            editHead: {
                required:"&nbsp;Please enter head name.",
                letterswithbasicpunc:"&nbsp;Please enter only characters."
            },
        },
        submitHandler: function(form) { 
            $.post("url",$("#orgEdit").serialize(),function(data){
                if(data != 'E') {
                    alert("Data Inserted Successfully.");
                    location.reload();
                } else
                    alert("Failed.");
            });
        }
    });
}
    </script>

jquery 検証は、データの追加中に正常に機能していますが、編集フォームでは失敗します。これについて私を助けてください。

4

1 に答える 1