jQuery/JS Input verification

Question

This is my simple form. I want to validate both inputs if it has some value inserted and that value is not a spaces. How can I achieve such functionality before request gets submitted to server side? Thanks a lot!

<form:form method="post" action ="${addQueryOverride}">
                    <label>Enter query string and product list ID: </label>
                    <input maxlength="30" class="text span-1" name="queryOverride" id="queryOverrideId"/>
                    <input onkeypress="return isNumberKey(event)" maxlength="30" class="text span-1" name="productList" id="productListId"/>
                    <input type="submit" value="Add">
                </form:form>

you may trim the inputs val and check if value is not equal to Empty string — Akshay Khandelwal
– Akshay Khandelwal, Commented Oct 8, 2013 at 16:14
But how do I do that on button click? How I prevent execution forward if invalid input is detected? THanks — Wild Goat
– Wild Goat, Commented Oct 8, 2013 at 16:18

mplungjan · Accepted Answer · 2013-10-08 16:21:34Z

1

$(function() { // when page load
  $("form").on("submit",function(e) {
    if ($.trim($("#queryOverrideId").val()) == "") {
      alert("Please enter query");
      $("#queryOverrideId").focus();
      return false;
    }
    var id = $("#productListId").val();
    if ($.trim(id) == "" || isNaN(id)) {
      alert("Please enter product list");
      $("#productListId").focus();
      return false;
    }
  });
});

answered Oct 8, 2013 at 16:21

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

tymeJV · Accepted Answer · 2013-10-08 16:19:07Z

1

On submit, iterate over each of the fields and run a check:

$("form input:text").each(function() {
    var isValid = this.value.length > 0 && this.value.indexOf(" ") == -1;
    return isValid; //if true, go to next element, if false, break each loop
});

answered Oct 8, 2013 at 16:19

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Collectives™ on Stack Overflow

jQuery/JS Input verification

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related