StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POShow/Hide Div's not submitting form with Client Side Validation and Attributes
text
Body
copied!<p>I have an ASP.NET MVC 3.0 application. Inside the application, I have a Login View which is strongly typed via a <code>LoginViewModel</code> class. In addition, the Login View can be accessed by two different types of people <code>Employees and Management</code>.</p> <p>The view is displayed in a <code>< table ></code>. The user must first select (from 2 radio buttons) what type of user he is (<code>Employee or Management</code>) and from the selection, I change the UI and display (show/hide) certain <code>div</code>s.</p> <p>If <code>Employee</code> is selected, I ask for the <code>Employee Number</code> and <code>Password</code>.</p> <p>If <code>Management</code> is selected, I ask for the <code>UserCode</code> and <code>Password</code>.</p> <p>The LoginViewModel has 4 properties:</p> <ul> <li>-<code>UserType</code> (represents the selected radio button)</li> <li>-<code>EmployeeNumber</code> (represents the textbox for Employees)</li> <li>-<code>UserCode</code> (represents the textbox for Management)</li> <li>-<code>Password</code> (represents the textbox for the Password regardless of who is selected)</li> </ul> <p>Since the UI changes according to the selected radio button, I can not use the <code>[Required]</code> attribute on both EmployeeNumber and UserCode properties because if I do, the <code>< form ></code> won’t submit (since one of the fields will be hidden).</p> <p>To overcome this limitation/problem, I have to remove the <code>[Required]</code> attribute on both properties and presumably do this client side.</p> <p>For the record, I am not using <code>MicrosoftMVCValidation.js</code> but instead <code>jquery.validate.min.js and jquery.validate.unobtrusive.js</code></p> <p><strong>Question 1)</strong></p> <p>When searching for examples online I’ve seen many of them including this file:</p> <blockquote> <p>jquery.<strong>unobtrusive</strong>-ajax.min.js</p> </blockquote> <p>What’s the purpose of this file and what’s its correlation with client side validation (if any)? Do I really need it? Shouldn’t jquery.validate.min.js and jquery.validate.unobtrusive.js suffice?</p> <p><strong>Question 2)</strong></p> <p>I understand that one could write a custom Validation Attribute and place it on the EmployeeNumber or UserCode property but if I do so (and knowing that I will be hiding one of them in the UI) how do I prevent myself from getting the same issue I had with the <code>[Required]</code> attribute? (meaning not being able to submit the form because one is hidden)</p> <p>Can I simply do this directly in the View? Would anyone be so kind to show me a quick example?</p> <p>Thanks</p> <p>Oh and yes…the jquery-1.7.1.min.js is included in the master layout (in case anyone asks).</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload