Client Block questions

Apr 17, 2012 at 1:55 PM
Edited Apr 17, 2012 at 2:10 PM

- I suppose it does but I need to confirm it: Does the client block utilize knockout.validation library?

- I can't find any demo code using Client Blocks. Can you help please?

 

I wan't to use the framework to:

- Generate knockout viewmodels and templates from .NET classes

- Send JSON between client and server

- Utilize data annotations for client side (knockout validate) as well as server side validation.

- Have composite pages composed of multiple views (partial views or client blocks or similar)

- Globalization of all page text and validation messages

Environment:

- MVC 3 (Sharp architecture)

- nHibernate

- Server-side ViewEngine is of no real importance although I guess Razor is the preferred choice at the moment.

Am I on the right track or is the MVC Controls Toolkit not the right choice?

Coordinator
Apr 17, 2012 at 7:40 PM

- I suppose it does but I need to confirm it: Does the client block utilize knockout.validation library?

No! It uses the standard jQuery.Validation plugin for conformity withe the remainder of the Mvc Framework. When you have a ServerSide ViewModel you can send just a part of it on the client side as a client Side ViewModel, the remainder of the model will continue working as....normal Mvc model with unobtrusive js and so on ...so for uniformity both use the jQuery validation plugin. HOWEVER, there are Mvc Controls Toolkit plugins, that allow they work well also with knockout...this is completely transparent to you. Moreover you can add also errors coming from the sever in various way, if the page is submitted WITHOUT ajax there is a ServerErrors call to be done in the razor or aspx function that add all sever errors automatically at the right places.  

See:

http://www.dotnet-programming.com/post/2011/10/28/Low-BandWidth-Transfers-with-Client-Side-Templates-of-the-Mvc-Controls-Toolkit.aspx

http://www.dotnet-programming.com/post/2011/10/29/Handling-Big-Amounts-of-Data-with-Client-Side-Templates.aspx

http://www.dotnet-programming.com/post/2011/10/29/Handling-Big-Amounts-of-Data-with-Client-Side-Templates-2.aspx

If the page exchange json data either with an Api controller or with a normal controller in json: you cn use the updateManager class refreshErrors that handles smartly server errors. see below

- I can't find any demo code using Client Blocks. Can you help please?

ALL TUTORIALS CONTAIN LINKS TO CODE INCLUDED THE ONES I LISTED ABOVE

Introduction to Client Blocks: http://mvccontrolstoolkit.codeplex.com/wikipage?title=Client%20Blocks

basic example contained in the examples that come with the codeplex binaries: http://mvccontrolstoolkit.codeplex.com/wikipage?title=Client%20Block%20complete%20example

The three tutorials already listed above.

 

I wan't to use the framework to:
- Generate knockout viewmodels and templates from .NET classes

ok done automatically by client blocks.


- Send JSON between client and server

use the updateManager class, It works both with Mvc4 ApiControllers and Mvc3 standard controllers.

See my tutorials :

http://www.dotnet-programming.com/post/2012/04/03/Mvc-Controls-Toolkit-Support-to-Mvc4-WebApi.aspx

http://www.dotnet-programming.com/post/2012/04/12/Mvc-Controls-Toolkit-Support-to-Mvc4-WebApi-2-Handling-Relations.aspx

The tutorial speaks about ApiController of Mvc4 but everything about the updateManager apply also to Mvc3 and among the code samples you can download there are also Mvc3 samples


- Utilize data annotations for client side (knockout validate) as well as server side validation.

Ok, you can! Everything is handled automatically by the various components of the Client Blocks you use you use 

- Have composite pages composed of multiple views (partial views or client blocks or similar)

You can do more Mvc Controls toolkit have "Templates" that are a generalization of partial views: see here: http://mvccontrolstoolkit.codeplex.com/wikipage?title=Use%20of%20Templates 

You can define also client side templates with templates that is with partial views and Razor helpers 
- Globalization of all page text and validation messages

ok! just need to add the js globalization scripts. See here: http://mvccontrolstoolkit.codeplex.com/wikipage?title=Globalization

Apr 23, 2012 at 12:46 PM

Thank you for a great answer! I haven't gotten around to test the framework for my purposes yet, but I'm getting there within a day or two. I have one more question though.

Custom validation summary.

I want to display the validation summary as a list of error messages with the ability to click each of the messages and have the control the error derives from being focused (and the page scrolled if needed). Is there anything in the framework to help me achieve this. How would you go about this when using Client Blocks (probably doesn't matter if is knockout binding based or "regular" asp.net mvc controls since the validation is all based on MVC anyway.

Coordinator
Apr 24, 2012 at 8:42 AM
Edited Apr 24, 2012 at 10:13 AM

Clicking...an error message in the summary and handling it is not an issue. just add a click handler to a div or any other html you put the summary in. Then due to event bubbling it will receive the click. The problem, is that the errors in summary have no "pointer" to the controls they come from( The error label near the controls that caused the error have it..instead). 

You should attach a .data() to the <li> that compose the summary where you put a pointer to the control in error. From this you have all information to do what you want. 

Anyway , all controls in error are always  "hilighted" as a default....

In case one uses the updateManager to communicate with server and the errors comes from the server the validation summary is handled already in a custom way so in this case it is easier to add this new functionality. However, for the remainder it is handled by standard Mvc routines....To customize the Mvc standard Client validation you should redefine some routined that are in the unobtrusive.validation file (the ones that build the summary)...I thing this can be done...in the worst case by redefining completely the validation summary handling. For the serrver controls you need simply to define a custom validation summary helper that contains some "data-" Html5 attributes in the messages with information on the error source.

As a conclusion you should customize 3 differente modules if you want this works in ALL CASES...However maybe you need it just in some case..

This require a deep knowledge of how error habdling works, or enough time to "get" how it works, so consider if this is worth in your case.

Anyway, if you don't want to put you fingers in thiis code, but you need "absolutely" this feature, our team is available for customizations.

Apr 25, 2012 at 12:04 PM
Edited Apr 25, 2012 at 12:42 PM

Thanks. We got the validation summary with each listed error as a link that sets focus on the control it's associated with.

Coordinator
Apr 25, 2012 at 3:02 PM

Very Good!

It was not an easy task if you modified it in all 3 places :)

Sometime it si possible to use the ValidationMessageFor to buid a Custom validation summary, this system has some drawback but is more easily customizable. Another trick is just "hacking" on the ValidationMessageFor labels to create dynamically a more responsive validation summary (labels respond immediately to any error change)