Validation

[Pino]

Hey,

Ok I'm trying to use the .Net validator controls to do some validation I have a form set up with labels. Now Ideally if the user enters incorrect data I want the label to turn red. Without writing custom javascript how can I achieve this using the validator controls?

Assume this is the form,

<label> * Membership Number</label>
            <asp:TextBox ID="txtMembershipNumber" runat="server" CssClass="txtInput"></asp:TextBox>
            
            <label>* Company name: </label>
            <asp:TextBox ID="txtPassword" runat="server" CssClass="txtInput"></asp:TextBox>

I can do all the code for the validator including the reg expresions etc. I can get the validator working below the label but I need it to repalce the label on invalid entry.

Any help?

[gep13]

Hey,

Are you talking about making this change on the client, or after the page is submitted?

All the .Net Validator controls do validation on both the client and the server. This gives the user a slightly better user experience (assuming they have javascript enabled) in that they don't have to wait for a postback in order to see that they haven't filled in a textbox.

If you want the colour change to happen on the client then it is going to have to be a custom javascript function. Assuming you are using a CustomValidator, you should be able to easily add this functionality into the function.

Is you are wanting to do this server side, then again this should be reasonably simple. Have a look at the Page.IsValid Property. Based on the state of that property, you could change the colours of the label.

As another option, have you thought about using the ValidationSummary Class.

Hope that helps (or at least gives you some ideas )

Gary

[Pino]

I'm fairly familiar with most of this, however I rarley dive into the front end stuff. Which is why I'm checking what I am doing is latest and greatest.

So theres no way to give the validator control a default piece of tetx to output?

[gep13]

Oh no, there certainly is, you can set the ErrorMessage, which would be automatically displayed in the ValidationSummary, or you can set the Text Property.

The way I normally do it is to set the Text Property to "*" then position it beside the control it is validating. Then, when validation fails, the "*" shows beside the control that is wrong, and then in the ValidationSummary you give more information about why it is wrong.

Gary

[Pino]

Ok I'm either overcomplicating this or missing somthing infront of me.

If I have the following when the form is shown

* Membership Number:   [ Field Here ]

and after I want it to look like

* Membership Number:   [ Field Here ]

(On invalid data) - Can this be done, without me writing jquery?

[mendhak]

You can have a look at the validation controls here

http://www.peterblum.com/DES/Home.aspx

[mendhak]

Oh, lots going on while I dallied. Yeah, you'll need a javascript solution if not that. Use a custom validator, use your own javascript to validate and set the label to red.

[gep13]

Ok I'm either overcomplicating this or missing somthing infront of me.

If I have the following when the form is shown

* Membership Number:   [ Field Here ]

and after I want it to look like

* Membership Number:   [ Field Here ]

(On invalid data) - Can this be done, without me writing jquery?

Yeah, I agree with Mendhak. What I would normally do in your situation is set the Text of the validation class to "*" and position it to the left of the label which says "Membership Number:", that way, the asterik will only appear (and you can set it to be red in colour) when something is missing from that control.

To get the whole label to turn red, then you would need do implement the custom javascript that mend mentioned.

Gary