jquery / ajax: check input field is not blank before executing function?

Question

I have the following ajax/jquery script which passes data to my mysql query and checks if the value in my input field matches that which is in my data base. the function works fine, however i am trying to add an if statement to prevent the function running if the input field is blank?

I have tried the following which should cause the border of the input field to turn red and prevent any other function happening, but this doesn't work and my script has completely stop working all together. please can someone show me what i am doing wrong? Thanks in advance.

HTML:

<input type="text" id="promo" placeholder="Promotional Code" class="login_form2" /><div class="promo_check"></div>

Script:

 <script type="text/javascript"> 
    $(document).ready(function() {
    $(document).on('click', '.promo_check', function() {
    var a = document.forms["request"]["promo"].value;
    if (a == null || a == ""  null) {
    if (a == null || a == "") { document.forms["request"]["promo"].style.borderColor = "#963634"; }
    return false;
    }else{
    var promo = $("#promo").val();
    $.ajax({
      type: "POST",
      url: "include/process_promo.php",
      data: {data:promo},
      success: function(data)
            {
            $(".form_error").show().html(data);
            }
    });

    });
    });
    </script>

hamed · Accepted Answer · 2015-03-12 09:56:18Z

3

Try this:

<script type="text/javascript"> 
$(document).ready(function() {
$(document).on('click', '.promo_check', function() {


var promo = $("#promo").val();
if(prome == null || promo == "")
{
    $("#promo").css("border-color", "#963634");
   return false;
}

else
{
  $.ajax({
  type: "POST",
      url: "include/process_promo.php",
      data: {data:promo},
      success: function(data)
            {
            $(".form_error").show().html(data);
            }
    });
}


});
});
</script>

answered Mar 12, 2015 at 9:56

hamed

8,04517 gold badges66 silver badges119 bronze badges

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

Comments

Naruto Dev · Accepted Answer · 2015-03-12 10:06:24Z

1

I think this should work for you:

<script type="text/javascript"> 
        $(document).ready(function() {
        $(document).on('click', '.promo_check', function() {
            var promo = $("#promo").val();
            if (promo) {
        $.ajax({
          type: "POST",
          url: "include/process_promo.php",
          data: {data:promo},
          success: function(data)
                {
                $(".form_error").show().html(data);
                }

        });
       } 
       else {
         $('#promo').css('border','#963634');
       }

        });
        });
        </script>

answered Mar 12, 2015 at 10:06

Naruto Dev

1,0035 silver badges11 bronze badges

Collectives™ on Stack Overflow

jquery / ajax: check input field is not blank before executing function?

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