jQuery Validation plugin and ASP.NET validators Web Forms - asp.net

I would really like use the jQuery Validation plugin in my ASP.NET Web Forms application (not MVC).
I value jQuery validation for the Richer UI experience I can provide the end user and I have some requirements to highlight the invalid fields using a red border (css).
I value asp.net validators because they run the validations not only on the client but on the server so that I don't open various security vulnerabilities to any user who is clever enough to turn off javascript in their browser.
So I am looking for a nice clean way to integrate these two technologies.
The best I can come up with is to have all ASP.NET validators set to enableclientscript=false and repeat the validation rules on the client in jQuery and on the server as asp.net validators but I can already see some challenges with this approach.
In the end I found the lowest friction way to achieve highlighting with asp.net validators and jquery was not to use the jQuery Validation plugin but to use the simple line of jquery which follows (note that the exact syntax will vary depending on how you layout your forms):
<script type='text/javascript'>
$("input[#type=submit]").click(function() {
$('span.validationerror:hidden').parent().parent().find('input').removeClass('inputError');
$('span.validationerror:visible').parent().parent().find('input').addClass('inputError');
});
</script>

You can use asp.net and jquery validators together with no problem... even on the same control... you just need to set CssClass for the control so that jquery can find it... and then you add OnClientClick="return $('#aspnetForm').valid();" to your submit button(s).
Be sure and include the usual jquery library and jquery.validate.js and add a document ready function of course, etc.

This might help!
http://www.delphicsage.com/home/blog.aspx?d=205

If you are serious about validation, I would look into something like Peter Blum's validators (http://www.peterblum.com/Home.aspx) as they should be able to do everything you want and more. They don't use JQuery, but remember the whole point of JQuery is to save developer time - the end user doesn't know or care whether you are using JQuery or not if the overall effect is the same.

Related

Dynamically loading asp.net controls with javascript

I am developing a series of ASP.NET controls that allow for a dynamically created sites where the layout gets generated from a class.cs file, the controls then get Loaded into an Placeholder in an update panel.
what I am hoping to achieve is using stuff like ajax to build the screen with javascript.
can you guys maybe point me in the right direction,
my google is not helping today.
I want to use stuff like ajax, json
thanks in advance
Javascript is a client-side scripting language and cannot be used to trigger loading of server-side controls.
You can use ASP.NET elements like etc., which have runat=server to trigger server side code, though.
Through AJAX? Not possible without page reload.

Disable javascript in GridViews

Is there a way prevent an ASP gridview from always relying on javascript for the edit and delete LinkButtons? If I disable javascript in my browser the edit and delete commands still seem to link to "javascript: _doPostBack". (I'm using VB and .NET framework 2.0)
Thanks in advance.
You could implement the edit and delete buttons yourself using an <asp:TemplateField>. Then you are free to have them do the postback however you like, with <input type=submit> buttons, perhaps.
You are limited to smaller subset of controls when Javascript is not available. See MSDN. The postbacks function conveys to the runtime what was clicked and that is how the server side events are triggered. If you really want to develop an app without Javascript support, you will have to stay away from most server controls. The rendering is fine but any interaction (like editable grid) would be one of those controls to stay away from. You might also want to look into ASP.NET MVC framework.

Alternatives to modal popup extender in asp.net?

I have a modal pop extender that has a user control in it, I use it in several forms in a
ASP.NET 4.0 project.
I am not very happy with the js code that it produces and the mess in the markup :/
So, any worthy alternatives that can be controlled from the codebehind easily :) ?
Having been down the road of Ajax Control Toolkit, I would recommend moving on to jQuery or some other javascript framework. While I understand the desire to "control it from codebehind," because it seems easier at first, trying to wrap client-side functionality in a server-side control usually is more trouble than it's worth.
Even in the simplest case, the the amount of javascript code needed to create a modal popup in jQuery (e.g.) is less than with Ajax Control Toolkit MPE. For example, I like the jQuery plugin SimpleModal. The code to turn a div into a modal popup using SimpleModal with default options is this:
<script type="text/javascript">
function showPopup() {
$('#<%=popupDivID.ClientID %>').modal({ appendTo: '#aspnetForm' });
}
</script>
Then you can just add that function to a click event, for example. And it's about a thousand times more flexible.
If you just don't like embedding javascript in your markup files, you can still technically control this all from codebehind by using ScriptManager to register the scripts and add events to controls.
Have you looked at the Ajax Control Toolkit on CodePlex. Ajax Control Toolkit It has several very useful controls that are very easy to implement. The toolkit includes a modal popup control as well as a popup control. In the link I gave you are all the instruction on how to download and use the toolkit.
Another option if you have access to it is Telerik controls. Their Ajax controls include what they call a radWindow which also works very well. You can read about it here. The drawback to Telerik is it is quite expensive.
I have used both and they work very well.
Use jQuery Dialog UI as this would likely give you the best supported option. It supports modal behavior.

What is the difference of using asp.net validator controls vs JQuery for front end validation

Could you please tell me the difference between using asp.net validator controls vs JQuery for front end validation? What happens if the user turns off javascript on their browser?
Thank you..
The difference is that "front end" validation by itself has nothing to do with security or real validation. It's entirely a performance optimization — a client validation failure saves a round trip to your server, helping you scale and allowing you to reduce the response time for your users. But the real validation work must take place server-side.
ASP.Net validation controls help you automate the server-side validation and keep it in sync with the client, while jQuery still requires you to write the server-side logic separately.
The ASP.NET validators will also check server side. You can check a boolean value to see if any have been violated.
If JavaScript is disabled the jQuery will do nothing, but the ASP.NET will still be able to check.
You can of course combine the jQUery with your own server-side validation, but it isn't built-in.
The ASP.NET validator controls are a lot easier for the average asp.net developer to use. I think using jquery is probably a lot "cleaner" and more flexible.

ASP.NET jQuery Ajax posting forms

I can't seem to get the jQuery.ajax() function posting back any of my asp.net generated form controls.
I've put a break point on the server side and there aren't any values.
Is there a way around this or do I have to build up a list of what I want sent back?
Another question slightly off topic, but it seems that although jQuery is a great JS library, it doesn't seem to integrate too well with .net.
Has anyone given up with jQuery to perform server side interaction and just gone with ms ajax implementation?
The reason for this is because asp.net webforms doesn't use a normal post (ie. with an input/submit button). if you take a look at how those are posted, there is some javascript handler that ends up calling a built-in function that asp.net writes out to the page called __doPostBack.
Check out this other stackoverflow answer that might give you additional clues:
Jquery asp.net Button Click Event via ajax
To your second question, once you work out a few of the kinks, jQuery is a fantastic lib that has a ton of support and reference material both on the web and in books. Keep at it and you won't regret it :-)

Resources