Check if input value is empty and display an alert

Question

How is it possible to display an alert with jQuery if I click the submit button and the value of the input field is empty   lt input type  quot text quot  id  quot myMessage quot  name  quot shoutbox msg quot  size  quot 16 quot  class  quot field nosize quot  maxlength  quot 150 quot  gt  amp nbsp   lt input id  quot submit quot  type  quot submit quot  name  quot submit post quot  class  quot button nosize quot  value  quot Senden quot  onclick  quot sendMessage    clearInput    quot  gt

User · Answer

Check empty input with removing space if user enter space  from input using trim     document  ready function                    button   click function                if   trim     fname   val                                           fname   css  border-color    red                   alert  Empty

User · Answer

Better one is here       submit   click function         if       myMessage   val              alert  warning                And you don t necessarily need  length or see if its  0 since an empty string evaluates to false anyway but if you d like to for readability purposes       submit   on  click  function         if      myMessage   val   length     0             alert  warning                If you re sure it will always operate on a textfield element then you can just use this value       submit   click function           if   document getElementById  myMessage   value               alert  warning                  Also you should take note that    input text   grabs multiple elements  specify a context or use the this keyword if you just want a reference to a lone element   provided theres one textfield in the context s descendants children

User · Answer

submit   click function       if     myMessage   val                 alert  Input can not be left blank               Update  If you don t want whitespace also u can remove them using jQuery trim       Description  Remove the whitespace from the beginning and end of a string        submit   click function       if   trim     myMessage   val                  alert  Input can not be left blank

User · Answer

You could create a function that checks every input in an input class like below  function validateForm            var anyFieldIsEmpty   jQuery  quot  myclass quot   filter function              return   trim this value  length     0         length  gt  0      if  anyFieldIsEmpty            alert  quot Fill all the necessary fields quot            var empty      quot  myclass quot   filter function                  return   trim this value  length     0                     empty css  quot border quot    quot 1px solid red quot            return false        else           return true           What this does is it checks every input in  myclass  and if empty it gives alert and colour the border of the input and user will recognize which input is not filled

User · Answer

Also you can try this  if you want to focus on same text after error   If you wants to show this error message in a paragraph then you can use this one      document  ready function              submit   click function              if     selBooks   val                             Paragraph id   text  Please select a book and then proceed    show                    selBooks   focus                return false

[javascript] Check if input value is empty and display an alert

Examples related to javascript

Examples related to html

Examples related to jquery

Examples related to forms

Examples related to validation