mvc : control specific required validation - asp.net-mvc-2

I am using mvc 2.0 with C#.Net
In my view page, I am creating multiple controls with required field validations. to plot my controls, I am using for loop through my mode object which is actually a collection of business object. For my TextBox control which represent 'user comments', I have put validation under it. like
<%:Html.TextBoxFor(model=>model.mycollection[i].Comment %>
<%:Html.ValidationMessageFor(model => model.mycollection[i].comments) %>
There is a sumit button for each row (for each comment textbox) like below
<input runat="Server" name="Button" id="Submit1" type="submit" class="button" value="save comments">
When the form loads, 3 rows are created, each containing a set of text box and a button to submit. This is because the model is a collection of 3 objects. So now I can submit each comments entered by user individually. But the problem is, when I click on any button, instead of validating corresponding textbox for required validation, it validates all of the textboxes on page at a time and gives error message for all of them. How to avoid this kind of behaviour? Mypage has a html.beginform method on top to put everything in a single form and to post the submit to an controller action.

Can you try to put each object from your collection in a separate form like this:
<table>
<% foreach(person in Model.Personlist) { %>
<tr>
<td>
<form>
<%=Html.TextAreaFor(...) %>
<%=Html.ValidationMessageFor(...) %>
<input type="button"......></input>
</form>
</td>
</tr>
<% } %>
</table>
..so then only that form will be validated when you click submit.
Also you can use divs instead of table .

Related

No validation working on the form inside the jQuery UI dialog

No validation plugin is working on the form contained inside a jquery Ui dialog box. Using Bassistance jQuery validation plugin, works great out of the ui modal box, no luck working it on the form contained inside the jQuery Ui modal box, nor the validate.js method is working. What might be wrong? Almost pulling hair out for this
Ok, this was not a jquery or any js problem.
The html was not formated properly, the form element was "inside" a table which didnot work,
always have form element enclose a table
<form>
<table>
<tr>
<td><!--input element here--></td>
</tr>
</table>
</form>
and not
<table>
<form>
<tr>
<td><!--input element here--></td>
</tr>
</form>
</table>
If you are enclosing form inside a table cell, it should be ok.

Submit button not work while using ClientValidation of asp.net mvc 2.0

I have one form with text box, submit button, drop down list ..... I'm using <%Html.EnableClientValidation(); %> to validate all the elements in my form. But the probem is when I write <% using (Html.BeginForm()){ }%>, the validation works, But when I click on the submit button, it did nothing even though I complete all the condition of each elements. And the submit button is submitting while I use <form method="post"> instead of <% using (Html.BeginForm()){ }%>.
I use jquery tab in my view, so I have more than one submit button that do different task(I test the value of the submit button in my controller).
Could any one tell me, what did I wrong here?
Thanks in advanced.
I'd make sure that you wrap your entire form in the braces when using the <% using (Html.BeginForm()){ }%>. If your submit button is not contained within those braces, then it will not cause the form to post.
<% using(Html.BeginForm()) { %>
... form elements here ...
<% } %>
When you use this method, remove the other form tags on the page as this syntax is equivalent to writing:
<form>
... form elements here ...
</form>

Passing value outside form

I need to get the value from outside the form. My gsp looks like this
<g:textField name="email" value="${someInstance?.email}"/>
<input type="button" id="checkEmail" class="button" value="Validate" onclick="checkEmail()"/>
<span id="responseDiv"></span>
<g:form action="save">
someCode
<g:submitButton disabled="true" style="color:#999999;" class="save" name="save" action="save" id="saveButton" value="${message(code: 'default.button.save.label', default: 'Submit')}"/>
</g:form>
First, to check if an email is in use, click button (id="checkEmail") and onclick goes to js code checkEmail() which has remoteFunction that updates responseDiv. After that, user enters information to the form, and user clicks submitButton. When that submit button is clicked, I would like my gsp to send email value along with other information to the controller. Any suggestion?
Thanks in advance.
Easy, put the input inside the form.
If that isn't an option for some reason, use the callback to update a hidden field inside the form with something like $("#hiddenEmail").val(emailAddress);
PS. I like how you gave a span an id of responseDiv :)

mootools clone form element

I cannot get a form to submit additional fields that have been cloned. When a form like the one below is submitted, it does not include the cloned form elements. Does anybody know why and how I can alleviate this issue.
<form>
<table>
<tr><td><input type="text" value="50" name="myvar[]" /></td></tr>
<!-- This button will clone the previous set of form elements -->
<tr><input type="button" value="Add New Line" onclick="this.getParent('tr').getPrevious('tr').clone().inject(this.getParent('tr'), 'before')" /></tr>
</table>
</form>
Your HTML isn't well formed, so this.getParent('tr') is returning null at least for me in Firefox. Put the button inside a td that is inside the tr and it works.
JSFiddle: http://jsfiddle.net/delvarworld/r99fN/ clicking the button throws an error
Thanks for the comment but the form was meant to be an example not actually what I had. I looked back at the form and the top form element was inside the table and the bottom form element was outside of the table. I moved the top form element outside of the table and everything works perfectly.
thanks,

Reset submit button not working, using MVC 2

I have two buttons inside a form call:
<% using (Html.BeginForm()) {%>
<input type="submit" value="Filter" />
<input type="reset" value="Clear Filter" />
The fields in question:
<td>
<%:Html.TextBox("filterId", Model.IdFilter, new {style="width:100px"}) %>
</td>
<td>
<%:Html.TextBox("filterTitle", Model.TitleFilter, new {style="width:500px"}) %>
</td>
<td>
<%:Html.TextBox("filterStatus", Model.StatusFilter, new {style="width:100px"}) %>
</td>
The first button calls the form action. The second button should either:
Clear the form and not post
Redirect to another action
Not sure why I'm having so much trouble with this, but it seems like there should be a very simple way to do this. However, all the solutions I've come across seem way too complicated for this.
Am I missing something?
EDIT: Here's the solution:
Change the reset button to a plain jane button with an id:
<input type="button" value="Clear Filter" id="clearFilter" />
Then add this script:
$(function () {
$("#clearFilter").click(function () {
$(':input', '#form0')
.not(':button, :submit, :reset, :hidden')
.val('');
$('#form0').submit();
});
})
You may have to write custom script to get the behavior you want. It is a reset button, after all, not a clear button.
At this point, if you change the values of the controls, then click the rest button, the form will be returned to its original state, of the state of whatever the model was when it was rendered.