web-dev-qa-db-ja.com

angularjsで送信フォームをクリックしたときに「このフィールドに入力してください」ポップアップを削除する方法ですが、他の検証は機能するはずです

宣言されている検証と通常の検証が表示されるはずなので、「このフィールドに入力してください」ポップアップを削除したい。

HTML：

<div class="panel-body">
    <form role="form" id="createForm" v name="createForm"  ng-submit="createAdminGroup(adminGroupData)">
        <div class="form-group" ng-class="{ 'has-error' : createForm.firstName.$invalid && !createForm.firstName.$pristine}">
            <label class="label1">First Name</label>
            <input name="firstName" id="firstName" class="form-control" placeholder="First Name" name="firstName"  type="text" ng-model="adminGroupData.firstName  " required/>
         <span style="color:red" ng-show="createForm.firstName.$invalid  && !createForm.firstName.$pristine">Please enter first name</span>
        </div>

        <div class="form-group">
            <label class="label1">Last Name </label>
            <input name="lastName" id="lastName" class="form-control" placeholder="Last Name" name="lastNmae"  type="text" ng-model="adminGroupData.lastName" />
        </div>

        <div class="form-group">
            <label class="label1"> Email Id </label>
            <input type="email" name="email" id="email" class="form-control"  placeholder="[email protected]" value=""ng-model="adminGroupData.email"/>
        </div>
        <div class="form-group">
            <label class="label1"> Password </label>
            <input name="password" id="password" class="form-control" placeholder="password"  value=""  ng-model="adminGroupData.password" />
        </div>

        <button name="submit" type="submit" class="btn btn-success" id="" ng-disabled="userForm.$invalid">Save</button>
        <button class="btn btn-default" id="cancel" type="button" onclick='handleCancelCreateAdmin()'> Back </button>

        </form>
</div>
javascriptjqueryhtmlangularjsvalidation
9
Priyanka Maurya

novalidate属性をformに追加して、ブラウザーのデフォルトの検証を無効にします

Exの場合

<form role="form" novalidate id="createForm" v name="createForm"  ng-submit="createAdminGroup(adminGroupData)">

Find more here

16
Guruprasad Rao

送信ボタンの中に属性formnovalidateを追加します。

例：

<button name="submit" type="submit" formnovalidate class="btn btn-success">Save</button>

これにより、ブラウザフォームの検証のみが無効になります。 AngularJSコードからの検証はまだ残っています。

あなたはW3C仕様を見ることができます ここ

私は数日前に同じ問題を抱えていました、そしてそれが私が何とか解決した方法です

6
Geraldo Novais

私はこれを試したところ、うまくいきました：

oninvalid = "this.setCustomValidity（ ''）" oninput = "this.setCustomValidity（ ''）">

2つの一重引用符の間にスペースを追加しました。

入力フィールドにbootstrapツールチップを追加し、必須であるため、無効な入力がフォーカスされ、ツールチップ値が表示されます。

思っていたよりもシンプルでした。

1
guy