HTML5入力検証でのカスタムエラー

Question

マテリアライズとHTML5入力検証を使用してカスタムエラー検証メッセージを表示しようとしています。エラーが検出されましたが（invalid疑似クラスが表示されます）、検証エラーメッセージは表示されません。

マテリアライズからこの例では、（データ・エラー属性が設定されている場合、フレームワークは、カスタムエラーを処理する必要があります）正常に動作します：

 <div class="input-field col s12"> 
     <input id="email" type="email" class="validate"> 
     <label for="email" data-error="wrong" data-success="right">Email</label> 
     </div> 

でもない、私のフィールドの1：基本的に

<div class="input-field col s12 m6"> 
     <input id="firstname" 
      type="text" 
      min-length="2" 
      max-length="25" 
      pattern="^[a-zA-Z]+$" 
      class="validate" 
      required autofocus><br> 
     <label for="firstname" 
      data-error="{{_ 'user_register_error_bad_firstname'}}" 
      data-success="ok">{{_ "first_name"}}</label> 
    </div> 

フィールド値が正規表現パターンに一致するようにしたいが、この場合は文字のみとする。

私は検証データ属性を誤って使用したと仮定しますが、方法はわかりません。あるいは、マテリアライズはパターンベースのエラーを処理しませんか？何か案が？

{{_ 'something'}}の構文は、SpaceBar i18nヘルパーコールにすぎないことに注意してください。

Answer 1

聖なる牛私は私の入力と、私のラベルの間で失わ<br>を持っていたので、それはすべてが起こった...