michaellunsford Posted June 10, 2014 Share Posted June 10, 2014 <input type="text" maxlength="5" name="zip" value="Zip Code" pattern="(\d{5})?" /> So, if the zip code is filled, it should be a five digit number. If it's not filled it's optional. The above RegEx is forcing everyone to enter a zip code. Can HTML do this, or am I going to have to script it? Quote Link to comment Share on other sites More sharing options...
Psycho Posted June 10, 2014 Share Posted June 10, 2014 (edited) I'm not sure how widely accepted the pattern tag is. Also, you definitely wouldn't want to rely upon it since a malicious user could easily circumvent it. But, this seems to work for what you are asking: pattern="[\d]{5}|.{0}" Not sure if this is the most efficient method. It's kind of a hack IMO. Basically looks for 5 digits OR any character matched 0 times. I did some limited testing it out and got the expected results. Edited June 10, 2014 by Psycho Quote Link to comment Share on other sites More sharing options...
Jacques1 Posted June 11, 2014 Share Posted June 11, 2014 Not sure what the .{0} is supposed to do. The pattern for “nothing” is simply ... no pattern. And why the brackets around \d? The \d itself is a character class. The pattern of the OP already solves the problem. What makes you two think it doesn't? It accepts either an empty string or exactly 5 digits. Note, however, that you normally need to use anchors to match the beginning and end of the string. If you just write, say, \d{2}, then this matches any string which includes two digits following each other. If you want a string which only consists of two digits, you need ^\d{2}$. In your case, however, it's not needed since the pattern corresponds with the maximum input length. Quote Link to comment Share on other sites More sharing options...
Psycho Posted June 11, 2014 Share Posted June 11, 2014 The pattern of the OP already solves the problem. What makes you two think it doesn't? He said it didn't. Since he was posting here for help stating that it wasn't allowing an empty value, I took him at his word. Not sure what the .{0} is supposed to do I stated that the expression I provided was a hack. With the assumption that the original expression didn't work, I tested this modified one to verify it returned the requested results. Quote Link to comment Share on other sites More sharing options...
michaellunsford Posted June 12, 2014 Author Share Posted June 12, 2014 (edited) Sorry for the delay in replying. Phpfreaks notifications suddenly started going to the junk folder. ??? Anyway, you guys are both right. The ^/d{5}$ works fine. EXCEPT I was setting value="Zip Code" (it's not a five digit number, and it's not blank). That field has a javascript on it that blanks on focus or submit. Unfortunately, Firefox won't fire the submit script if the RegEx doesn't match. Sooo..... Is it possible to have a default value in an input field that doesn't match the RegEx? I'm thinking to just go all javascript and dump the pattern idea. Edited June 12, 2014 by michaellunsford Quote Link to comment Share on other sites More sharing options...
Solution cyberRobot Posted June 12, 2014 Solution Share Posted June 12, 2014 You could use a form field label instead: <label>Zip Code: <input type="text" maxlength="5" name="zip" value="" pattern="(\d{5})?" /></label> It looks like you're using XHTML, so this next suggestion may not work. But you could also use HTML 5's placeholder attribute: <input type="text" maxlength="5" name="zip" value="" pattern="(\d{5})?" placeholder="Zip Code"> Quote Link to comment Share on other sites More sharing options...
michaellunsford Posted June 12, 2014 Author Share Posted June 12, 2014 (edited) ah hah! I knew there was a solution. I had searched for "default value" and a few other things -- the term "placeholder" escaped me for the moment. the space is pretty tight, so I had wanted to avoid the label. the placeholder is exactly what I was looking for. I am using HTML 5, btw. Validator says it's good. Why did you think I'm still on XHTML? 5 no longer requires closing the attribute? Edited June 12, 2014 by michaellunsford Quote Link to comment Share on other sites More sharing options...
cyberRobot Posted June 12, 2014 Share Posted June 12, 2014 I am using HTML 5, btw. Validator says it's good. Why did you think I'm still on XHTML? The self-closing <input> tag: ...pattern="(\d{5})?" /> Note the space and slash at the end. Quote Link to comment Share on other sites More sharing options...
michaellunsford Posted June 12, 2014 Author Share Posted June 12, 2014 must have missed my edit -- does input no longer need to be closed in 5? It validates... Quote Link to comment Share on other sites More sharing options...
cyberRobot Posted June 12, 2014 Share Posted June 12, 2014 To be honest, I don't have a definitive answer. I just remember needed to add slashes to the end of tags like <input>, <br>, etc. when making the switch from HTML 4 to XHTML. The slash was added to conform to XML standards. Since we're going back to an HTML standard, I just assumed the slash was no longer needed with HTML 5. Quote Link to comment Share on other sites More sharing options...
michaellunsford Posted June 12, 2014 Author Share Posted June 12, 2014 Odd. Checked a few places and it looks like you're right. It's an old habit of mine: if you open it, close it. Don't know that I can ever go back to the old HTML 4 methods. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.