Daley Dilemma My Own Dilemma

20May/120

Rehash : C# – OnClientClick Breaks Validation

Rehash a post from the previous version of my blog:

When coding the front end of a web application that submits some data you obviously want to be sure that the data is valid. This is easily achieved by creating a validation routine.

Although this is the solution that you need if you want the client (browser) to do something via JavaScript you need to use the button's OnClientClick parameter. Here is an example:

<asp:Button ID="btnSubmit" runat="server" Text="Submit"
    onclick="btnSubmit_Click" ValidationGroup="myValidation"
    CausesValidation="true" OnClientClick="hideButton('btnSubmit');" />

The problem is that when your validation routine fires off so does the clientside JavaScript. For this case the submit button is removed, correct action it the form is submitted, but if the validation fails the submit is still hidden and the user can change the information to be valid but can no longer submit the form.

To get around this issue you need to add a check on the OnClientClick parameter that will only fire the JavaScript function if the page is valid. The following has the addition of the check built into the form button element:

<asp:Button ID="btnSubmit" runat="server" Text="Submit"
    onclick="btnSubmit_Click" ValidationGroup="myValidation"
    CausesValidation="true" OnClientClick="if (Page_ClientValidate('myValidation'))hideButton('btnSubmit');" />

Bingo, works like a champ.

8Mar/123

jQuery Textbox Hint & Validation Plugin

Recently I have been working on projects that have required a fair amount of jQuery. As such I have searched for many plugins to suit my needs. Some are successful, others, not so much. With the jQuery plugin site down, who knows when it will be back online, it has been a little difficult to find reliable resources.

As a result I went on a search for a plugin that would do textbox hints. You know, the text in a textbox telling you what information you need to put into it. Then when you click on the textbox the text is removed and you are free to type in your text. I ran across a few that were semi reliable. Many of which just had some crazy JavaScript that I really did not what to drop into my project.

Those plugins that were functional were missing one major component that I wanted in the plugin, validation tie-in's. Basically I wanted to not have to add an addMethod for all of my textboxes that had the text hint. Especially because this would require that for each method I hard code in what my hint text was. Yes, I know that there are ways that I could have made it work. But I was looking for something simpler.

What this has done is force me to finally make my first jQuery plugin. The scope of this plugin is to allow you to place hint text in any textbox. Then when the validation is called, with the validation plugin, the control will be checked against the hint text to be sure that the text is not the same. Here is the result:

Usage:

jQuery(document).ready(function($){
$('#tbDemo-1').textboxhint({
text: 'Your Name',
hintcssclass: 'tbhint1',
normalcssclass: 'tbNormal'
});
});

Demo:

File:
jquery.textboxhint.validate-1.1
jquery.textboxhint.validate-1.0


19Feb/120

New Frontier

Recently I have been wanting to take a stroll down the blogging path again. In celebration of this I have started anew on WordPress. In the coming days I will transfer over some of my more popular posts that I made at my previous blog. Then I will move forward and see what new things I can accomplish.

First off will be the posting of a jQuery plugin that I recently wrote named "jquery.textboxhint.validate". It is really nothing too special but it is something that I have developed to simplify the forms process in some of my projects.

Anyway, that post will come soon. Until then I will be moving over a post or two from the previous blog.

Filed under: Uncategorized No Comments