Semger
Semger

Reputation: 263

HTML5 Form Input Type: Checking the input

I would like to check if the URL the user entered into the input box contains 'xyz' before sumbitting. I am aware this can be done with php after fetching the put, however can this be done in HTML5?

For example, here I put in a random word, and HTML5 tells me this is not a URL. Like this

Can i get it to check if the entered text contains something before submit?

My code

  <input type="url" name="tradeurl" placeholder="Steam Trade URL">
  <input type="submit" value="Update">

Upvotes: 1

Views: 144

Answers (1)

tagawa
tagawa

Reputation: 4611

Yes you can, using the HTML5 pattern attribute as @fred-ii suggests like so:

<input type="url" name="tradeurl" placeholder="Steam Trade URL" pattern="[^ ]*(xyz)[^ ]*">

Even if you do this you need to validate server-side as well — it's easy to disable client-side (HTML/JavaScript) validation.

Upvotes: 1

Related Questions