jQuery - 使用return false后查询不会停止
I'm having a problem... when a user clicks submit - the error message shows, but the jQuery doesn't seem to stop on Return False;
See code below:
function validateSubmit(){
// this will loop through each row in table
// Make sure to include jquery.js
$('tr').each( function() {
// Find first input
var input1 = $(this).find('input').eq(0);
var qty1 = input1.val();
// Find Second input
var input2 = $(this).find('input').eq(1);
var qty2 = input2.val();
// Find third input
var input3 = $(this).find('input').eq(2);
var qty3 = input3.val();
// Find select box
var selectBx = $(this).find('select');
var selectVal = selectBx.val();
if(qty1 === '' && selectVal != 'Please Select...') {
alert("You've chosen an option, but not entered a quantity to dispute, please check your inputs.");
return false;
}
if(qty1 != '' && selectVal === 'Please Select...') {
alert("You've entered a quantity, but not chosen why, please check your reasons.");
return false;
}
if (qty1 > qty2) {
alert("For one of your entries, the disputed quantity is larger than the shipped quantity.");
return false;
}
});
}
HTML where it's called
<table>
<thead>
<tr><th>Item ID</th><th>Description</th><th>Dispute Quantity</th><th>Shipped Quantity</th><th>Ordered Quantity</th><th>Reason</th></tr>
</thead>
<tbody>
<?php
$data = mysql_query("SELECT * FROM `artran09` WHERE `invno` = '$invoiceno'") or die(mysql_error());
echo "<center>";
$i = -1;
echo "<form action=\"submitdispute.php?invno=".$invoiceno."&ordate=".$placed."\" method=\"POST\" onsubmit=\"return validateSubmit();\">";
while ($info = mysql_fetch_array($data)) {
$i += 1;
echo "<tr>";
echo "<td>".$info['item']."</td>";
echo "<td>".$info['descrip']."</td>";
echo "<td><input type=\"text\" input name=".$i." onKeyPress=\"return numbersonly(this, event)\" maxLength=\"3\"></td>";
echo "<td><input type=\"text\" value=".$info['qtyshp']." name = \"ship$i\" onKeyPress=\"return numbersonly(this, event)\" maxLength=\"3\" disabled=\"disabled\"></td>";
echo "<td><input type=\"text\" value=".$info['qtyord']." onKeyPress=\"return numbersonly(this, event)\" maxLength=\"3\" disabled=\"disabled\"></td>";
echo "<td><select name = \"reason$i\">";
echo "<option>Please Select...</option>";
echo "<option>Short/Not received</option>";
echo "<option>Damaged Goods</option>";
echo "<option>Product Not Ordered</option>";
echo "</select></td>";
echo "</tr>";
}
?>
</tbody>
</table>
</div>
</div>
<p><input type = "submit" value = "Dispute" name ="Submit">
</form>
Any ideas?? Help massively appreciated
The return currently will leave the each(), not validateSubmit()
(validateSubmit currently doesn't return anything)
Define a variable at the begin of validateSubmit(), e.g.
var r=true;//default returnValue
and put this at the end of validateSubmit():
return r;
Now, when you want to leave validateSubmit() , call inside the each:
r=false;return;
This will leave the each()
and also validateSubmit()
with the returnValue r
(what will be false
now)
Add a preventDefault call to your code. Change the line:
function validateSubmit(){
to the following
function validateSubmit(e){
e.preventDefault();
...
Ensure that your button uses 'return' also to return the returned value:
<input type="submit" onClick="return validateSumbit();" />
Also you should remove the onsubmit handler from the form tag.
Your validateSubmit()
function doesn't seem to return a value. Only the callback function of the each()
method returns a value, but your actual submit handler does not. In essence, your validation code runs as expected, displaying the error messages but not returning any value to indicate of failure.
You should define a variable within the scope of validateSubmit()
which the each()
method can modify and return that.
For example:
function validateSubmit() {
var form_is_valid = true;
$('tr').each( function() {
// Validation goes here
if (something_is_invalid) {
form_is_valid = false;
return;
}
});
return form_is_valid;
}