Need best MVC 4 Web API Grid - json

Could any one please suggest the best MVC4 WEB API Grid ?
Right now we are using Mustache templates to display Data.
Current App: MVC 4 Web API, C#.Net, Visual Studio 2012, Mustache templates
Client wants Mustache templates to be replaced with nice grid with all the search and sorting features.

Datatables.net provides a lot of functionality and is widely used.

I've had success using jqgrid - a lot of functionality and demos for mvc -
http://www.trirand.com/blog/

Datatables, jqgrid, kendoUI etc.. they will in the long term cause you extreme frustration and unhappiness.
Best thing to do is really make data LOOK like a grid, you can have complete control and really understand what is going on and do sorting and paging etc.. Use Bootstrap for CSS and make ajax calls to Web Api.
Angular is really nice, but you can start without Angular. I've been on 40 projects in which the 3 I mentioned caused a lot of headaches for many people including myself.

Related

Umbraco vs DotNetNuke with own template

I would like to ask you to which one from this two systems i can easier implement my own template? I have ready template of my web page and i want to integrate it with one of this systems, my template contains some js code.
If you want to do it easy, I prefer to use Umbraco, because DNN for now, it is powerful and complex solution.And it will take more time for integration.
If your website really really simple, most probably, you can build website with Umbraco without any line of custom code c#.

HTML Layout/Templating

I am building a website where i'm looking to create html templates which contain placeholders where i'll be able to inject pages/content, menus, etc.... I really like AngularJS which has good support for this but am thinking that it might be a bit of an overkill for what i'm building. There is a chance some parts of the application will eventually be ripped out and run standalone and so dont want to tie the html/javascript to a library which requires so much framework specific syntax. Are there any other, simpler libraries, that will allow me to do this? thanks in advance
/Eric
KnockoutJS is pretty lightweight and also includes a templating feature.
I wouldn't just dismiss angularjs because it seems like a heavy framework. There are very simple ways to use it without using any of the "advanced" features like routing, creating services, creating directives, etc. You can simply have a controller and use the built in directives to do a lot of powerful things on a single page. Angular is also pretty small and is easily bootstrapped with the ng-app tag anywhere in your DOM.

asp.net mvc 4 vs JavaScript templates

I've been struggling in deciding what direction to go with in regards to the best approach for rendering content to the browser: server side using razor or client side using JSON data and some form of templating (jsRender, loadJson, etc.)
Here's a great article on using client side templating with asp.net mvc:
jQuery Templates/View Engines in ASP.NET MVC
ASP.Net MVC 4 has some great toys (WebAPI). I can see creating a suite of WebAPI functionality for delivering JSON data that can be used on traditional web pages and even mobile pages. Really cool stuff.
Then I look at what options you have going with a traditional ASP.Net MVC approach. You have layouts, can take advantage of automatic bundling/minification of JS/CSS files (more ASP.Net MVC 4 goodness), robustness of having ASP.Net MVC available at your fingertips. Really cool stuff.
So, my question is how do you make decisions on which direction you should go architecturally? I suppose you can have a mix bag of approaches within your site, but that becomes a maintenance issue. Going total JavaScript Templates and consuming JSON data from a service is a super clean separation of concerns, but it seems you loose out on a lot of the goodness that ASP.Net MVC offers like routing.
What's the best approach for balancing all of the options available to us?
This is a bit of a general question, so a general answer is that you should stick to the approach that makes you most productive/gets the job done. Either approach works but of course has tradeoffs. However those usually don't matter that much unless you reach really big scale (e.g. Twitter recently annonced it will move back to server-side rendering for performance reasons). If you're already familiar with MVC and you're working against a deadline - stick to that. If you have more time or want to learn a new technique - go with what looks interesting.

Is developing a webbased app more efficient with Ext JS/Dojo & et al than with HTML/JQuery

The server side is pretty much set up, it's basically
struts 2 / spring security / jpa.
Now I have to decide what to do with the client side (the browser). The client side codebase should be maintainable and should lend itself to automatic regression testing.
So as an example lets say I need a table component having properties such as
sortable/pageable columns
reordering of rows and columns (via drag & drop)
inline editing of table cells
remembers state when customer re-visits page
integrates easily with struts 2
As far as I understand things there're 4 alternatives
DIY using oldschool HTML + JQuery + Ajax
Finding a JQuery plugin that does all this or
plumb together different plug-ins (like Flexigrid + additional plug-in for drag & drop)
Using a JS toolkit
Should I stick with JQuery? Or should I go for fullblown JS toolkits? I have little experience with JQuery and JS toolkits (I'm not a web developer).
Thank you for helping a serverside programmer cross the messy world of web-ui-programmming ;)
My experience is that Dojo's support for programming-in-the-large is great if you have a large-scale app that will benefit from the build system, class system, widgeting system and integrated widgeting library. It also of course brings all the standard stuff with it, like cross-browser support and event system.
If you just need some widgets and animations then any library will work. I'd stick with the one you/your team knows best. jQuery definitely has the greatest number of people with that skillset.
Our team wasted 6 months trying to give the client what they wanted with JQuery/UI, and we switched to ExtJS 4, and the client is happy after 2 months. This is an app with 50+ models.
JQuery/UI is NOT designed for web applications. It is designed for web SITES. Sure, it has some good plugins, but you'll spend countless hours learning their apis and switching your thought process between them all. JQuery/UI lacks the following:
a graphical designer (see Sencha Designer 2), ie graphical layout GUI program
complicated layouts (in ext you can switch a layout of a container to accordion, tabs, wizard, anchors with one setting)
a grid (ext grid supports paging, sorting, filtering, grouping, summaries, editing out of the box)
real comboboxes
a model view controller system
templating
good html editor control
a whole ton of other stuff
do yourself a favour and spend the money on ext, and save yourself countless hours.
regarding the grid you mentioned, ext's is far superior to anyone else's. you can do what you listed in about 20 nicely-formatted lines. i am not kidding.
regarding client-side unit testing, use jasmine with ext.
The short answer is yes. Frameworks like Ext.js take care of a whole lot code that you would end up writing yourself if you were to write everything from scratch. These frameworks take care of models, events, views, communication with servers/APIs, etc.
This isn't really an answerable question. It all depends.
ExtJS is great for very specific things. If you want those very specific things, it's likely the most efficient option for you.
If jQuery UI meets your needs, then that's your answer.
If you have jQuery dev's, maybe stick with jQuery.
If you have ExtJS folks, consider ExtJS
etc, etc.

How is the HTML on this site so clean?

I work with C# at work but dislike how with webforms it spews out a lot of JavaScript not including the many lines for viewstate that it creates.
That's why I like coding with PHP as I have full control.
But I was just wondering how this sites HTML is so clean and elegant?
Does using MVC have something to do with it? I see that JQuery is used but surely you still use asp:required validators? If you do, where is all the hideous code that it normally produces?
And if they arent using required field validators, why not? Surely it's quicker to develop in than using JQuery?
One of the main reasons I code my personal sites in PHP was due to the more elegant HTML that it produces but if I can produce code like this site then I will go full time .net!
One of the goals of ASP.NET MVC is to give you control of your markup. However, there have always been choices with ASP.NET which would allow you to generate relatively clean HTML.
For instance, ASP.NET has always offered a choice with validator controls. Do you value development speed over markup? Use validators. Value markup over development speed? Pick another validation mechanism. Your comments on validators are kind of contradictory there - it's possible to use ASP.NET and still make choices for markup purity over development speed.
Also, with webforms, we've had the CSS Friendly Control Adapters for a few years which will modify the controls to render more semantic markup. ASP.NET 3.5 included the ListView, which makes it really easy to write repeater type controls which emit semantic HTML. We used ASP.NET webforms on the Microsoft PDC site and have kept the HTML pretty clean: http://microsoftpdc.com/Agenda/Speakers.aspx - the Viewstate could probably be disabled on most pages, although in reality it's only a few dozen bytes.
You were on the right track. It is the fact that they are using the ASP.NET MVC web framework. It allows you to have full control of your output html.
The ASP.NET MVC Framework is an alternative to the normal "web forms" way of doing ASP.NET development. With it you lose a lot of abstraction, but gain a lot of control.
Yes - MVC doesn't utilize the ASP.NET view state junk.