88102

how to retrieve any inserted string in input type 'number' in html

Question:

Is there any way of getting the inserted string(of any sort) from:

<input type="number" id='zipCode' name='zipcode' />

I'm trying to get value in console as:

console.log(document.getElementbyId('zipCode').value);

is giving just a blank output when any <strong>invalid string(string containing any alphabet or other special characters)</strong> is inserted which is also the same when actually left the field blank. But I want to retrieve the actual inserted value so that I can differentiate and validate the blank field with error message <strong>"Zipcode Field Empty!"</strong> and on invalid character string with error message <strong>"Invalid Zipcode!"</strong>. <strong><em>Is there any way to retrieve any sort of inserted string from input type='number' field?</em></strong>

Answer1:

HTML input fields used for Zip Codes should be type=text and use the pattern attribute to provide hints to the browser

A numeric ZIP code is -- in a small way -- misleading.

Numbers should mean something numeric. ZIP codes don't add or subtract or participate in any numeric operations. 12309 - 12345 does not compute the distance from downtown Schenectady to my neighborhood.

ZIP codes aren't numbers -- they just happen to be coded with a restricted alphabet -- I suggest avoiding a numeric field. Same goes for credit card or social number

You can do <input type="text" pattern="\d*">. This will cause the numeric keyboard to appear on iOS (and Android?). Maybe it was pattern="[0-9]*"

<blockquote>

"The semantically correct markup for a text field that can still contain whitespace and other special characters is <input type="text" inputmode="numeric"/> however as far as I am aware while inputmode is recommended by <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#attr-fe-inputmode" rel="nofollow">WhatWG</a> it is not yet supported by any browsers. Its intent is to present the user with a numeric keypad on a device that has it but still behave as a text input." - <a href="https://stackoverflow.com/users/1676834/davidelrizzo" rel="nofollow">davidelrizzo</a>

</blockquote>

Answer2:

From what I remember reading (example here - <a href="https://stackoverflow.com/questions/18677323/html5-input-type-number-value-is-empty-in-webkit-if-has-spaces-or-non-numeric-ch" rel="nofollow">HTML5 input type=number value is empty in Webkit if has spaces or non-numeric characters?</a>) there is no way of doing this with the input type set to number.

Recommend

  • beforeunload event during window close Vs meteor-auto-reload
  • XNA Number lock affects input
  • Get users zipcode using facebook javascript api
  • Jquery autocomplete with php as remote source: how to append second variable from input to source
  • Insert multiple values into hidden field
  • Colorize knockoutjs comment bindings in code editor
  • ValidationResult Returned From IValidatableObject.Validate Is Not Localized
  • iOS Validation failed -> Bundle is invalid (Xcode 6.2, iOS 8.2)
  • jQuery - how to validate a date of birth using jQuery Validation plugin?
  • Add delivery info to query in SAP Crystal Reports
  • Using HTML/CSS for UI in XNA?
  • C function strchr - How to calculate the position of the character?
  • Salesforce Different WSDL files and when to use
  • Trying to get the char code of ENTER key
  • PLSQL: Get number of records updated vs inserted when a merge statement is used
  • CakePHP ACL tutorial initDB function warnings
  • presentShareDialogWithParams posts to FB wall, but callback handler results say error
  • Jackson Parser: ignore deserializing for type mismatch
  • Time complexity of a program which involves multiple variables
  • preg_replace Double Spaces to tab (\\t) at the beginning of a line
  • How to use remove-erase idiom for removing empty vectors in a vector?
  • Checking free space on FTP server
  • Exception “firebase.functions() takes … no argument …” when specifying a region for a Cloud Function
  • Using variable in a value field in jMeter
  • Repeat a vertical line on every page in Report Builder / SSRS
  • Why is an OPTIONS request sent to the server?
  • How can I send an e-mail from a vbs script
  • Sails.js/waterline: Executing waterline queries in toJSON function of a model?
  • Retrieving value from sql ExecuteScalar()
  • Can Jackson SerializationFeature be overridden per field or class?
  • Validaiting emails with Net.Mail MailAddress
  • Numpy divide by zero. Why?
  • How to get icons for entities from eclipse?
  • KeystoneJS: Relationships in Admin UI not updating
  • Proper way to use connect-multiparty with express.js?
  • Load html files in TinyMce
  • Hits per day in Google Big Query
  • how does django model after text[] in postgresql [duplicate]
  • JaxB to read class hierarchy
  • Checking variable from a different class in C#