Jqueryを強制することで、必要に応じて入力を検証し、電子メールの検証を行います。

Question

次のフォームを検証する必要があります。一部のフィールドは必須ですが、電子メールフィールドには電子メールの検証が必要です。

注：「ルール」部分を削除した場合、検証はすべての必須フィールドで機能しますが、最初に値frmUser-emailが入力されていることを確認する必要があります（必須）。そこに値がある場合は、電子メールの検証を行います。

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#adduser").validate({ 

     rules: { 
      frmUser-email: { 
       required: true, 
       email: true 
      } 
     }, 
     errorClass: "my-error-class", 
      validClass: "my-valid-class", 
      groups: { 
       required1: "frmUser-username frmUser-password frmUser-secretword frmUser-secretwordprompt frmUser-usertype" 
     }, 
      errorPlacement: function(error, element) { 
      error.appendTo('#errorlabel') 
     } 

    }); 
}); 

<form id="adduser" name="adduser" method="post" action="?vars=<?php echo URLEncryptEncode('module=user&call=add-process',$urlp);?>"> 
<table border="0" cellspacing="0" cellpadding="0" class="forminput"> 
    <tr> 
    <td>User Login Name:</td> 
    <td><input name="frmUser-username" type="text" size="25" class="required"/></td> 
    </tr> 
    <tr> 
    <td>Password:</td> 
    <td><input name="frmUser-password" type="text" size="25" class="required"/></td> 
    </tr> 
    <tr> 
    <td>Secret Word:</td> 
    <td><input name="frmUser-secretword" type="text" size="25" class="required"/></td> 
    </tr> 
    <tr> 
    <td>Secret Word Prompt:</td> 
    <td><input name="frmUser-secretwordprompt" type="text" size="25" class="required"/></td> 
    </tr> 
    <tr> 
    <td>Telephone:</td> 
    <td><input name="frmUser-telephone" type="text" size="15"/></td> 
    </tr> 
    <tr> 
    <td>E-Mail:</td> 
    <td><input id="frmUser-email" name="frmUser-email" type="text" size="30"/></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td colspan="2"><input type="submit" value="ADD NEW USER" class="button" /></td> 
    </tr> 
    <tr> 
     <td></td> 
    <td><label class="errorlabel" id="errorlabel"></label></td> 
    </tr> 
</table> 
</form> 

うまくいけば、誰かが..事前に感謝

Answer 1

ファーストをオフに助けることができる、あなたは自分の入力で両方のクラスを指定することができます。

<input id="frmUser-email" name="frmUser-email" type="text" class="required email" size="30"/> 

しかし、場合ルールオブジェクトを使用して設定されている場合、fromUser-emailを引用する必要があります。途中のが無効になります。だから、同じ他のすべてを残すが、あなたのルールのためにこれをオブジェクト行います

rules: { 
     'frmUser-email': { 
      required: true, 
      email: true 
     } 
    } 

は、どちらか一方を行い、あなたは問題ないはずです。