CODEWITHSUNDEEP
javascriptjqueryhtmlhybrid-mobile-appicenium
Trupti
Trupti

Reputation: 627

How to remove HTML5 title attribute after validation

I am using html 5 for mobile development in Icenium.

I want to do validation so I used required attribute along with title attribute to show messages to user.

But once I do enter correct input into the specified fields that title messages should get remove; as it won't be appropriate to show messages to user once they enter appropriate values.

I want to remove titles form fields after validation, is there any way for this?

<li>
    <label>First Name:
        <input type="text" data-bind="value: firstName" required title="Please Enter your First Name">
    </label>
</li>
<li>
    <label>Last Name:
        <input type="text" data-bind="value: lastName" required title="Please Enter your Last Name">
    </label>
</li>
<li>
    <label>Email:
        <input type="email" required title="please enter your email" data-bind="value: emailAddress" autocomplete="off">
    </label>
</li>

Upvotes: 0

Views: 1014

Answers (2)

C3roe
C3roe

Reputation: 96240

If you want to rely on HTML5 functionality, then I’d suggest making use of the constraint validation API.

element.willValidate, element.validity.valid or element.checkValidity() are what you could query upon the blur event (or change, keyup, whatever) to see if a certain element is currently in valid state or not.

Upvotes: 0

Ringo
Ringo

Reputation: 3965

Try this:

<li>
    <label>First Name:
        <input class="txtCheck" type="text" data-bind="value: firstName" required title="Please Enter your First Name">
    </label>
</li>


$('.txtCheck').on('blur keyup', function(){
      if($(this).val() == "yourvalue"){
         $(this).removeAttr('title');
      }
});

Upvotes: 0

Related Questions