javascript空字段验证

Question

I have used the following code to display product details in my shopping cart website.

<div id="inner_right">
<form name="product_form" id="product_form"  method="post" onsubmit="form_quantity(<?php echo $productid; ?>);">
<input type="hidden" name="hidden_<?php echo $productid; ?>" id="hidden_<?php echo $productid; ?>" />

  <h1>Product Details of <?php echo $fetchproductname; ?></h1>
  <div>&nbsp;</div>
  <div id="product_left"><img src="<?php echo $path.$fetchimage; ?>" alt="" width="400" height="300" /></div>
  <div id="product_right">
    <div><strong>Category Name:</strong> <?php echo $categoryname; ?></div>
    <p><strong>Product Number:</strong> <?php echo $fetchproductno; ?></p>
    <p><strong>Price:</strong> <span class="price">$<?php echo $fetchproductprice; ?></span></p>
    <p><strong>Stock:</strong> <?php echo $fetchproductstock; ?> nos</p>

    <?php


    $select_quantity = "SELECT * FROM `tbl_cart` WHERE `intProductid` = '".$productid."' AND `intSessionid` = '".$globalsessionid."'";
    $select_quantity_res = mysql_query($select_quantity);
    $sel_qty_num = mysql_num_rows($select_quantity_res);

    $fetch_quantity = mysql_fetch_array($select_quantity_res);


        $fetch_proid = $fetch_quantity['intProductid'];
        $fetch_exqty = $fetch_quantity['intQuantity'];
        ?>
        <p><strong>Quantity:</strong> <input name="quantity_<?php echo $productid; ?>" id="quantity_<?php echo $productid; ?>" value="<?php echo $fetch_exqty; ?>" class="quantity" type="text" /></p>




    <div class="submit">
      <button id="registerButton" type="submit">Add To Cart</button>
    </div>
    <input type="hidden" name="cart" id="cart" value="<?php echo $productid; ?>" />
  </div>
  <div class="clear">&nbsp;</div>

  </form>
</div>

There is an quantity field and add to cart button in my page. If the buyer click add to cart button without entered the quantity field an error should popup. For that i used the following javascript code.

function form_quantity(val){


var enteredqty = document.getElementById('quantity_'+val).value;
if(enteredqty =='')
{
alert(Please enter quantity);
}


}

But it doesn't work. I couldn't trace the error. How can i correct my code?

Answer 1

You've got a string literal with no quotes:

alert(Please enter quantity);

You need to say:

alert("Please enter quantity");
// OR
alert('Please enter quantity');

(When you say you couldn't trace your error, what did you actually try? If using Chrome it has built-in debugging tools, or for Firefox you can download Firebug, and these tools can easily tell you about errors like this.)

And to preempt your next question, once you fix the above error you'll find that although the alert displays the form still submits. You need to update your onclick to return the result of your form_quantity() function, and return false when you don't want the submit to go ahead (i.e., when there's a validation error):

<form name="product_form" id="product_form"  method="post"
      onsubmit="return form_quantity(<?php echo $productid; ?>);"></form>

<script>
function form_quantity(val){
   var enteredqty = document.getElementById('quantity_'+val).value;
   if(enteredqty === '')  {
      alert('Please enter quantity');
      return false;
   }
}
</script>