might be a dumb question but since i am so new with ASP.NET i have a hard time understanding when you should use for example the built in login controller, vs. a custom login-form with custom code-behind?
Coming from PHP and this is why i cant seem to get a grip on this, same about the ASP.NET SiteMapPath with a menu controller vs. just using a href or asp:HyperLink?
If the login control suits your needs, use it, after all it's tested, secure, standardised (so hopefully easily maintained). If you don't have any exotic requirements go with it. It's pretty flexible.
On a tangent, if you're new to asp.net but not tied to it, I'd highly recommend MVC instead.
I am working on redesigning and streamlining the checkout process for an Ecommerce website using ASP.NET/C# into 1 page. (Currently, the website doesn't use any ASP controls)
Just for a little back info, the customer will be able to enter a shipping address, add a gift message, and select a shipping date per recipient while updating the backend with the correct information. I want this process to be elegant and pain free for customers to use.
Now I have created WebMethods that get called through AJAX requests that work correctly on previous features.
My question is:
Would it be an ok idea to submit ALL these requests through WebMethod AJAX calls, have it update the backend, and render the correct information to the user?
I know it is doable but I just want to be sure that this is an ok approach to take. I have been looking at other JavaScript frame works that might help but am too unfamiliar with them to know if they would work or not.
Please let me know what you think and if you have other suggestions.
Thank you!
Short answer: Yes.
You mentioned:
an Ecommerce website using ASP.NET/C# into 1 page
If that is true, then you are talking about a single page web app. There are a couple of references to single page web apps here:
https://msdn.microsoft.com/en-us/magazine/dn463786.aspx
https://en.wikipedia.org/wiki/Single-page_application
It's very common to do what you are talking about. Using AJAX to perform back-end processes and then update small pieces of the front end is key to making fluid, fast, and responsive web applications. That's mainly because smaller pieces of data are being sent through the network, and the UI is being updated in smaller segments. If architected correctly, single page web apps can provide a slick, intuitive web experience for clients and customers. Emphasis on "If architected correctly". So make sure to do your research.
There are several libraries out there that can help you, such as:
jQuery
jQueryUI
Bootstrap
Angularjs
Sencha ExtJs
Backbone
Knockout
You don't have to use them, but they can save you a lot of time. At the very least, I would recommend using jQuery. Do some research and find out which one(s) will work best to fit your specific application.
I don't see any problem in this approach, the good part about ajax WebMethod is that you will transfer only the important data to do the operation. its better and fast than use a updatePanel
We use a lot of ajax webMethod in our asp.net project and we never got problems with it :)
A good advice is looking for asp.net mvc, its better than asp.net web forms
I've just read an interesting article about how Microsoft seems to be moving towards a REST interface + client-side javascript-based MVVM development for web applications.
Although I technically understand the basic difference between the two models, I am utterly confused regarding its implications about how I write web applications and most importantly how to transition gracefully to this new model.
So, for someone moving from traditional ASP.NET MVC to WebApi + KO, the following questions arise:
Is there a way to have unobtrusive or near-unobtrusive (i.e. minimal code) validation using MVC + KO?
How does one go about unit testing his UI code?
Does browser compatibility suffer with KO?
Is there anything else someone has to consider when moving from one model to the other?
You see Microsoft starting to push this "single page web app" thing partly because it can provide a better user experience but largely because it makes it much much easier to migrate your web app to being a Windows 8 native application.
Re: unobtrusive javascript for validation… I would say that if you're using Knockout, you're UI and your scripts are going to be so tightly coupled even just for basic stuff that unobtrusiveness is really not a valid goal. You can do validation in Knockout (see https://github.com/ericmbarnard/Knockout-Validation#readme for example) but it's not unobtrusive by the same definition as ASP.NET MVC
Re: unit testing... take a look at https://stackoverflow.com/questions/6331789/knockoutjs-unit-testing-with-qunit
Re: browser compat... I'm not aware of any compatibility issues with any modern browsers unless you have crazy users who have disabled JavaScript
I found this to be a really nice discussion of the pros and cons of trying to be "unobtrusive" with a Knockout site.
Traditionally I'm very much in favour of keeping Javascript as unobtrusive as possible, and with my Knockout expressions I try to keep them as minimal and tidy as possible by shifting any heavy lifting into functions on my view model and creating custom bindings which encapsulate DOM logic - but I'm firmly of the opinion that the declarative approach itself (such as the default of using the data-bind attribute), when used sensibly, is the way to go.
Perhaps it's because my introduction to Knockout is a web application "port" of a WPF application I worked on, and the Knockout bindings of my site are becoming surprisingly close to their XAML equivalents as I learn more about how to leverage Knockout gracefully. I just love being able to eyeball markup and see at a glance the real business logic around how a view is evaluated, rather than the specifics of how jQuery or whatever physically builds it in response to some click event wired up in a big soul destroying Javascript file.
When I revisit some of my traditional MVC sites which leverage lots of procedural jQuery to hook things up, I think, yeah the markup is tidy, but going back to it after 6 months even I have difficulty understanding what my intention was with all those jQuery selectors, callbacks, and DOM traversals. I think I would only apply the Knockout bindings themselves dynamically if I had to, i.e. if there was a situation where my binding logic was itself dynamic - but that could probably be accomplished differently with dynamic templates anyway.
That's my 2 cents on the unobtrusive aspect of your question, and if your experience moving to MVVM Javascript is anything like mine has been over the last few months, you won't look back.
I keep hearing that the server side ASP .NET AJAX controls (like UpdatePanels) are not truly AJAX though they seem like it, because rendering is not completely on the client side. I'm trying to understand this with more clarity. Could someone elaborate?
Thanks...
UpdatePanels came out fairly early in the AJAX cycle, and they're heavy (they can emit around 100-300k of JavaScript). Behind the scenes, UpdatePanels post the entire page back to the server via a JavaScript XMLHttpRequest. The new page is generated with the normal page lifecycle just like a postback, but only the parts that live inside the UpdatePanel (plus the parts necessary for updating ViewState and so on) are sent back to the client. From there, the markup is inserted without a visible flash or interruption of page state.
Most competing AJAX tools lean towards super lightweight implementations that let you ship or generate a small chunk of HTML via Javascript, and I would say that's the dominant direction today, especially outside the ASP.NET world.
The difference in total amount of data sent across the wire is huge -- see the link below. In low-traffic situations it might not make a bit of difference, but in the case of a site like StackOverflow, it would show up on the bandwidth bill for sure.
All that said, I don't think it's fair to say that UpdatePanels are not actually AJAX, since they do ship HTML around via asynch JavaScript -- it's just that there's a gigantic, often cumbersome framework on top. UpdatePanels get a bad rap sometimes, but they provide a brilliantly simple developer experience. I've often found them useful in low-traffic situations.
Update: Here is an article (old but still valid) that examines the payload UpdatePanels ship to and from the server. It also goes into Page Methods, which is a lightweight, Web Service-based alternative to UpdatePanels. This is an oft-overlooked part of Microsoft AJAX.
http://msdn.microsoft.com/en-us/magazine/cc163480.aspx
Maybe this will answer???
I hope. (Reading it as well).
Seems to me that the Control is a Server Side object that uses ajax as a mechanism and that the ajax is rendered to do the client side. In this sense It isn't pure ajax but, rather a blending of multiple solutions.
:)
I'm getting into ASP.NET (C# - I know it doesn't matter for this particular question, but full disclosure and all that), and while I love that the asp:-style controls save me a lot of tedious HTML-crafting, I am often frustrated with certain behaviors. I encountered one last night when working with Master Pages: my <asp:BulletedList ID="nav">, when converted into HTML, became <ul id="ct100_nav">.
There are other issues--I noticed that when you auto-populate a DataGrid, it adds attributes to the resulting table that I don't necessarily want there.
I know that there is a certain amount of "convention over configuration" that you have to accept when you rely on a framework to take over some of your tedious duties, but the "conventions" in these cases aren't so much any established conventions, but rather unnecessary extras. I know why the ID adds the prefix, but I should be able to tweak and turn things like this off, especially since, as a bit of a web standards evangelist, I don't duplicated HTML id's in a single page anyway.
So the question here is for those ASP.NET devs more seasoned than I: in your experiences in developing and deploying apps, how do you leverage these controls? Do you find yourself resorting back to hard-coded HTML? Do you use a blend? I don't want to design my HTML around idiosyncratic quirks in these controls, but, if possible, I'd like to leverage them when possible.
What's a boy to do?
Personally,
I think the standard ASP.NET controls are fine for inhouse stuff - quick and dirty is good in that scenario. But, I once worked with a web developer who was also a designer and he refused to use the ASP.NET controls and only code in HTML and add runat="server" tags when needed. This was more because he wanted to know exactly how his HTML was going to be rendered, and at the time anyway, some of the ASP.NET controls wouldn't render to standards compliance.
I sit somewhere in the middle - use HTML where appropriate and not when not. You can sort of best of both worlds with the CSS control Adapters
I'm actually quite relieved to see some opinions here agreeing with my own: ASP.NET as a template language is very poor.
I'd just like to rebut a couple of the pro points made here (flamesuit on!):
Dave Ward mentions ID collisions - this is true, but my how badly handled. I would have preferred to see nodes referenced by xpath or deep css selectors than by making the ID effectively useless except by deferring to ASP.NET internals like clientID - it just makes writing CSS and JS that much harder pointlessly.
Rob Cooper talks about how the controls are a replacement for HTML so it's all fine (paraphrasing, forgive me Rob) - well it's not fine, because they took an existing and well understood language and said "no, you have to do things our way now", and their way is very poorly implemented. e.g. asp:panel renders a table in one browser and a div in another! Without documentation or execution, the markup for a login control (and many others) isn't predictable. How are you going to get a designer to write CSS against that?
Espo writes about how controls give you the benefits of abstraction if the platform changes the html - well this is clearly circular (It's only changing because the platform is changing, and wouldn't need to if I just had my own HTML there instead) and actually creates a problem. If the control is going to change with updates again how is my CSS supposed to cope with that?
Apologists will say "yes but you can change this in the config" or talk about overriding controls and custom controls. Well why should I have to? The css friendly controls package meant to fix some of these problems is anything but with it's unsemantic markup and it doesn't address the ID issue.
It's impossible to implement MVC (the abstract concept, not the 3.5 implementation) out of the box with webform apps becuase these controls so tightly bind the view and control. There's a barrier of entry for the traditional web designer now because he has to get involved with server side code to implement what used to be the separate domains of CSS and JS. I sympathise with these people.
I do strongly agree with Kiwi's point that controls allow for some very rapid development for apps of a certain profile, and I accept that for whatever reason some programmers find HTML unpleasant, and further that the advantages the other parts of ASP.NET give you, which requires these controls, may be worth the price.
However, I resent the loss of control, I feel the model of dealing with things like classes, styles and scripting on the codebehind is a wrongheaded step backwards, and I further feel that there are better models for templating (implementation of microformats and xslt for this platform) although replacing controls with these is non-trivial.
I think ASP.NET could learn a lot from related tech in LAMP and rails world, until then I hope to work with 3.5 MVC where I can.
(sorry that was so long </rant>)
The short answer is that you should never use an asp:... version of a standard HTML control unless you have a really good reason.
Junior developers often get suckered into using those controls because they're covered in most ASP.NET books, so it's assumed that they must be better. They're not. At this point, after 8 years of daily ASP.NET development, I can only think of 2 or 3 cases where it actually makes sense to use an asp:... INPUT control over a standard HTML one.
As for the ID's on server-controls: You can find the actually ID that is going to be written to the browser by accessing ClientID. That way you can combine server-side og client-side scripting and still dont have to hardcode _id="ct100_nav"_
I always try to use the included controls instead of "hacking" HTML, because if there is an update or some improvement later on, all my code will still work by just replacing the framework and I don't have to change any HTML.
Hope this helps
#Brian,
Yup! You can pretty much control all the behaviour.. Consider looking into creating Custom Controls (there are three types). I recently gave an overview of them in my question here.
I would strongly recommend checking them out, has help me no end :)
I too am on my adventure into ASP.NET and have also had similar frustrations.. However, you soon get used to it. You just need to remember, the reason you dont have the tedious HTML crafting is because the ASP.NET controls do it all for you.
To some extent you can control/tweak these things, even if it means inheriting the control and tweaking the HTML output from there.
I have had to do that in the past, where certain controls were not passing W3C validation by default by putting some extra markup here and there, so I simply overrode and edited as necessary (a fix that too literally a couple of minutes)..
I would say learn about how the controls system works.. Then knock a few together yourself, this has really helped me grok whats going on under the hood, so if I ever get any problems, I have an idea where to go.
The HTML renders with those sort of IDs because its ASP.NET's way of preventing ID collisions. Each container control, such as a Master page or Wizard control, will prepend an "ID_" on its childrens' IDs.
In the case of your bullet list, the ListView provides a nice middle ground. You can still bind it to a datasource, but it gives you much tighter control over the rendered HTML. Scott Gu has a nice intro to the ListView here:
http://weblogs.asp.net/scottgu/archive/2007/08/10/the-asp-listview-control-part-1-building-a-product-listing-page-with-clean-css-ui.aspx
If the ID's prefix added by ASP.NET is an issue for you to access them later using JS or something... you have the .ClientID property server side.
If the overhead added by ASP.NET you should consider ASP.NET MVC (still preview) where you have full control over the emitted html.
I'm moving to MVC because I don't like all that stuffs added too....
I think most of the answers here take a designer's point of view. On a small-to-medium project it might seem like an overhead to synchronize code and CSS/HTML and make them standards-compliant and clean. A designer's way to do that is to have full control over rendered HTML. But there's many ways to have that full control in ASP.NET. And for me, having the required HTML in the aspx/ascx file is the most non-scalable and dirty way to do it. If you want to style controls through CSS, you can always set a class server-side through the CssClass property. If you want to access them through JS, you can emit the JS with right IDs server-side again. The only disadvantage that this provides is that a dev and a designer have to work together closely. On any large project this is unavoidable anyway. But the advantages ASP.NET provides far outnumber these difficulties.
Still, if you want standards-compliant HTML, skinning support and other goodies to control rendered markup, you can always use thrid-party controls.
As Dave Ward has already mentioned, "it's ASP.NET's way of preventing ID collisions."
A very good example of this is if you're attempting to put a control inside of a custom control, then use that custom control in a repeater, so that custom control's HTML would be output multiple times for the page.
As others have mentioned, if you need to access the controls for javascript, use the ClientScript property which will give you access to a ClientScriptManager and register your scripts to the page this way. Be sure when writing your scripts to use the ClientID property on the control you're trying to reference instead of just typing in the control's ID.
If you want that much control over the rendered HTML, look into ASP.NET MVC instead.