<label>タグ

Question

を生成する代わりに、Jqueryの妥当性検査で既存の要素にエラーメッセージを入れます。Jquery validation plug-inを使用して、以下の2つの入力要素を検証します。 入力が無効である場合には、プラグインのような、右の入力フィールドの後にラベル・タグを生成します。<label for="company" style="">Required !</label>

質問： はどのように私は代わりに新しい<label>を生成する存在<span class="help-inline">にエラーメッセージを入れていますか？

ご協力いただきありがとうございます。

<script type="text/javascript"> 

$('#signUpForm').validate({ 
          debug: false, 
          rules: {company:"required",username:"required"}, 
         messages: {company:"Required !",username:"Required !"} 
          })// End of validate() 

</script> 


<div class="control-group"> 
    <label class="control-label" for="company">Company Name</label> 
    <div class="controls"> 
     <input type="text" name="company"> 
     <label for="company">Required !</label> // -> this line is generated by Plug-In. 
     <span class="help-inline">(required)</span> 
    </div> 
</div> 

<div class="control-group"> 
    <label class="control-label" for="username">User Name</label> 
    <div class="controls"> 
     <input type="text" name="username"> 
     <span class="help-inline">(required)</span> 
    </div> 
</div> 

Answer 1

オプションで構築活用し、プラグインがあなたのspan要素を作成できるように容易になるだろう。生成されたHTMLの最終結果は、あなたが要求しているものになります。

• <span>に<label>を変更するにはerrorElementを使用してください。 help-inline

にデフォルトのエラー・クラスを変更する

使用errorClass jQueryの：

$(document).ready(function() { 

    $('#signUpForm').validate({ // initialize the plugin 
     errorElement: 'span', 
     errorClass: 'help-inline', 
     rules: { 
      company: "required", 
      username: "required" 
     }, 
     messages: { 
      company: "Required !", 
      username: "Required !" 
     } 
    }); 

}); 

HTML：

<form id="signUpForm"> 
    <div class="control-group"> 
     <label class="control-label" for="inputCompanyName">Company Name</label> 
     <div class="controls"> 
      <input name="company" type="text" id="inputCompanyName" placeholder="" /> 
     </div> 
    </div> 
    <div class="control-group"> 
     <label class="control-label" for="inputFirst">User Name</label> 
     <div class="controls"> 
      <input name="username" type="text" id="username" placeholder="" /> 
     </div> 
    </div> 
    <input type="submit" /> 
</form> 

DEMO：http://jsfiddle.net/eRZFp/ところで

：あなたのUser Nameフィールドはname属性、name="username"がありませんでした。このプラグインを正しく動作させるには、すべての入力要素に一意のname属性が含まれている必要があります。