Hi jquery users,
I have forms which has a lot of input inside and all of it I set as
required. Actually I generated the form using database, not by hand :)
each input has unique id (generated by server).
at the moment, the validation wont work on all field, it just detect
the first fields ... (eg: houseHoldExpfood, expPerson1food,
expPerson2food) .. but ignored another fields.
is this jquery validation bug ?
here is
My javascript code:
$(document).ready(function(){
$('#householdBudgetForm').validate({
errorLabelContainer: $('#householdBudgetErrorMsg'),
submitHandler: submitHouseholdBudgetForm
});
});
here is my form :
<form action="/save" method="post" name="BudgetForm" id="BudgetForm" >
<table width="100%">
<thead>
<tr>
<th>Expenses</th>
<th>Suggested exp</th>
<th>Household exp</th>
<th>%</th>
<th>Person1</th>
<th>Person2</th>
<th>Reason</th>
</tr>
</thead>
<tbody><tr class="tr_even">
<td>Food incl groceries & take aways</td>
<td>
2,100
<input type="hidden" value="2100.00"
id="suggestedExpfood" name="suggestedExp"/>
</td>
<td><input type="text" title="Please enter Expense for
Food incl groceries & take aways" myid="food" value=""
id="houseHoldExpfood" name="houseHoldExp" size="10" class="money
required houseHoldExp"/></td>
<td>
<span id="percentagefood"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Food incl groceries & take aways" myid="food" value=""
id="expPerson1food" name="expPerson1" size="10" class="money required
expPerson1"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Food incl groceries & take aways" myid="food" value=""
id="expPerson2food" name="expPerson2" size="10" class="money required
expPerson2"/>
</td>
<td>
<span style="margin: 0pt; padding: 0pt;" class="reason"
id="reasonfood">
<input type="hidden" value="" id="reasonfood"
name="reason"/>
<a class="reasonLink" myid="food" id="reasonLinkfood"
href="#"><img src="/ilink/images/reason.png"/></a>
</span>
</td>
</tr>
<tr class="tr_odd">
<td>Phone mobile internet</td>
<td>
830
<input type="hidden" value="830.00"
id="suggestedExpcommunication" name="suggestedExp"/>
</td>
<td><input type="text" title="Please enter Expense for
Phone mobile internet" myid="communication" value=""
id="houseHoldExpcommunication" name="houseHoldExp" size="10"
class="money required houseHoldExp"/></td>
<td>
<span id="percentagecommunication"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Phone mobile internet" myid="communication" value=""
id="expPerson1communication" name="expPerson1" size="10" class="money
required expPerson1"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Phone mobile internet" myid="communication" value=""
id="expPerson2communication" name="expPerson2" size="10" class="money
required expPerson2"/>
</td>
<td>
<span style="margin: 0pt; padding: 0pt;" class="reason"
id="reasoncommunication">
<input type="hidden" value="" id="reasoncommunication"
name="reason"/>
<a class="reasonLink" myid="communication"
id="reasonLinkcommunication" href="#"><img src="/ilink/images/
reason.png"/></a>
</span>
</td>
</tr>
<tr class="tr_even">
<td>Entertainment, pay tv</td>
<td>
1,100
<input type="hidden" value="1100.00"
id="suggestedExpentertainment" name="suggestedExp"/>
</td>
<td><input type="text" title="Please enter Expense for
Entertainment, pay tv" myid="entertainment" value=""
id="houseHoldExpentertainment" name="houseHoldExp" size="10"
class="money required houseHoldExp"/></td>
<td>
<span id="percentageentertainment"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Entertainment, pay tv" myid="entertainment" value=""
id="expPerson1entertainment" name="expPerson1" size="10" class="money
required expPerson1"/>
</td>
<td>
<input type="text" title="Please enter Expense Person
1 for Entertainment, pay tv" myid="entertainment" value=""
id="expPerson2entertainment" name="expPerson2" size="10" class="money
required expPerson2"/>
</td>
<td>
<span style="margin: 0pt; padding: 0pt;" class="reason"
id="reasonentertainment">
<input type="hidden" value="" id="reasonentertainment"
name="reason"/>
<a class="reasonLink" myid="entertainment"
id="reasonLinkentertainment" href="#"><img src="/ilink/images/
reason.png"/></a>
</span>
</td>
</tr>
............. another fields .....
</table>
</form>
