We Keep Coding

Best resource to learn How to Create AJAX enabled User Controls

In our project, we use lot of User Controls. None of them supports AJAX. We use UpdatePanel for partial page rendering. There is no proper client side functions for the controls.
I used to create normal JS functions in the ascx page itself. I guess it is not the standard way to add client functionality to a User Control. However i can achieve all the things which i required , with out using any such standards. But when considering the maintainability, it is tough & it is hard to make changes & not scalable.
So i want to learn the proper way to create AJAX enabled User Controls. Just like how Telerik & other 3rd party controls create User Controls. What is the recommended way to create such controls by Microsoft.

Could you be more specific about the problem with Update Panel??
To use inbuilt ajax,
1. You need a ScriptManager
2. Put all necessary controls within Update Panel
Since you are using User Controls, its better to add ScriptManager in the main page where the User Control is added. Otherwise it might give an error saying multiple ScriptManager found.

UpdatePanel uses AJAX and is easy to use, however, if you want true client side controls, i.e. only call the server when you need too, then it's probably best to look elsewhere.
If you want to write your own controls, I'd recommended reading about some JavaScript design patterns, specifically the module pattern. If you have decent JavaScript skills, it's extremely easy to create controls with the help of jQuery - may as well make it a jQuery plugin. You might want to check out some client side MVC/MVVM frameworks like AngularJS or Knockout might be enough, because at least they'll help you with data bindings so it's less painful to manage the data on the client side and get it back to the server.
But, unless you're doing some that no one else has done before, why not use some existing controls by Telerik or DevExpress for example?
Example of module pattern (there's a bunch of different ways to do module pattern, this is just one):
var myModule = {
/* PROPERTIES */
prop1: 'sdfsdf',
prop2: 123,
/* FUNCTIONS */
func1: function () {
alert('!!!');
}
}
/* example use of module */
alert(myModule.prop1);
myModule.func1();
You'll also need to have a good understanding of events in JavaScript. For example, if you wanted to create a client side grid (there's millions already available for free), you'd need to handle click and text changed types of events. i.e. to handle paging, sorting, filtering and any other feature you might want out of your grid.
Edit: just created a basic JSFiddle to give you an example of a really basic client side control using a jQuery plugin. It doesn't work perfectly, but thought it might give you an idea of where to start if you wanted to try making your own controls.
http://jsfiddle.net/pwqmenwx/1/

Non-MVC alternatives to ajax for passing data to usercontrols

I'm in a huge bind.
Long story short, I am working on a big project and am learning ASP.NET, C#, everything as I go.
The elementals of my project are comprised of user controls. My line of thinking was that I could create many user controls, each performing a function for a "component" of the project I'm building. Up until now I have been using clientside scripting to postback ajax calls to the code-behind on each of my user controls. AJAX worked well because it allowed to me pass data(that I need from the client) to my user controls and then I could return something in order to do an action.
I have been using a method for generating querystrings to create a callback "action" in order to determine what method needs to handle what data when the postback is sent to the code-behind side.
My problem now is that I need to start using many user controls one page -- and so now whenever ANY control does a postback ALL of the controls go through a page load. I thought my callback solution would take of this, but it isn't. Particularly when I drop a custom registered control into another user control.
I have done multitudes of research and having seen various ways to get around this, the best of them being [WebMethod] and controllers. However the project I am working on is NON-MVC.
I am also attempting to use UpdatePanel controls to minimize postback to the entire page but have had little success.
What can I use as alternatives? I feel like I'm running out of options or am missing something very basic here.
TL;DR -- I need a non-MVC method to pass data to user controls that can distinguish between multiple controls. Cannot use pagemethods(or page). Manual ajax calls are not working out. Cannot afford to do a full postback

Take a look at:
updatepanel vs page methods
Based on this:
My problem now is that I need to start using many user controls one page -- and so now whenever ANY control does a postback ALL of the controls go through a page load.
This might sound simple but have you tried to use if(!this.IsPostBack) in your load events?
Well not, the only way to avoid this situation, is using PageMethods or create a Script Service to handle AJAX requests (Web services with the ScriptService attribute or WCF REST services)
Note that even if you use the evil UpdatePanel, absolutely all the page life cycle will execute, which means that the whole page viewstate has to be sent in each post, the only advantage of using UpdatePanel controls is that you gain partial rendering, that's it, the performance on the server side doesn't change at all.
So you could use PageMethods or Script Services. But there's a catch, if you start using them you will notice an incredible performance change, your application will be more responsive (RIA applications), but the catch is that you won't be able to use the benefits of the ASP.Net server controls such as GridView, Repeater, etc. In other words you would need to change most of your view controls (this is the approach followed when working with MVC applications)

You can create static methods on your aspx page and mark it with [WebMethod]. Then you can call the method using jQuery ajax from the user user control markup. Take a look at this blog

When to use javascript instead of creating an aspx page?

I am new at C#.Net and i have one question that i couldn't manage to find on the internet. When should i use a classic combination of html + javascript + css instead of using an aspx page with a code behind?
As i experienced since i started .net , i found that aspx pages and code behind is a huge ease for developers. I didnt need any piece of javascript code since i started. There must be something wrong. I think i am missing a point. Can you answer my question and tell me some examples that i must use html+javascript+css instead of aspx + aspx.cs or vice versa??
Have a nice day.

Javascript is a client side technology, running only in the browser, whereas ASP.NET runs on the server side. These allow you to achieve different and complementary things.
With a classic server side language, any user interaction that you want to respond to must typically be posted across the internet from the browser to your server. It is then processed by the server, which responds with a new page for the browser to load. This generally means that the response time for the user is slower, though you will have access to a much richer programming environment on the server.
With a client side language, everything is processed on the browser. This allows for faster feedback to the user, though at the expense of working within the much more restricted programming environment that the browser gives you, and with no access to stuff your application may depend on, such as your database.
Of course, the lines are blurred somewhat when you make an AJAX request (usually a call written in Javascript that makes a request to the server, receives the response, and updates the page dynamically).
You mention that you have not used any Javascript so far. Perhaps as a starting point you'd like to investigate validating user input on the client side? This way, errors are caught and reported to the user immediately without the cost of the round trip to the server. http://www.tizag.com/javascriptT/javascriptform.php
Both client side and server side technologies can be powerful and useful. Use a combination of them both to give the best experience for the user.

In my experience, using Javascript/jQuery in .NET has been for UI and client-side validation purposes. If you are building an app that does not require Javascript to meet your client's requirements, then take advantage of what .NET has to offer. However, implementing Javascript is not that hard, so feel free to use what you prefer and is in the best interest of the client. You can still write and use Javascript in an ASPX page.

One of your considerations might well be speed. Javascript in a web-page will run on a site visitor's browser. Code-behind runs on the server hosting the page.

from my experience the main aim to use the companion of html,css,javascript with asp.net when the client needs is for a web app that acts exactly like win app
that u don't need to flush over the page to the server and come back again

Points you are missing
Code behind is not what makes ASP.NET; you can make a web app with all C# code right into the aspx files.
If you choose ASP.NET and C# for a web app, all your pages should be aspx ones, except for very specific and not very common situations.
You need to understand the difference between server side scripting and client side scripting. ASP.NET is a server side scripting technology while javascript is a client side only one. Take a look.
You can create aspx pages that are as simple as you want -even without any relevant serverside scripting- and thats all right.
Attempt to answer
You use the word must, so:
You must use aspx instead of only javascript if you want any kind of server side processing.
You must use an html file with plain javascript, jquery and css if there is the specific requeriment to do so, wich would be very uncommon. That could be a situation where a) the page should be as fast as it can possible be b) you don't mind everyone to be able to see your full code by just selecting view source on the browser c) there is no need at all for server side processing d) you don't mind about the little extra mix of technologies on your web application.

You use Javascript/JQuery to perform operations that does not need any server side processing like validating controls for a range or for empty values, some fancy UI stuff. It is much faster than the code behind because it does not post back to server however you could use UpdatePanel aspx server control to have partial post back and avoid reloading the page.
As a web developer you should always use combination of server-side processing and client-side processing. Working logic and application processes on the client-side allows browser based applications to seem more responsive and to have more "snappiness" to them.

If you are looking for highly customizable and high performance pages, then I would go with html + javascript + css and make calls to some webservice. This way you are not restricted by asp.net controls. Also, there are a lot of caveats with standard out of the box web forms that can lead to page performance issues and overhead - ViewState being one. You can also design your own asp.net controls as well, but there is some learning curve.
It really boils down to personal preference (there isn't anything in one that you can't do in the other) : Fundamentals vs Abstraction. To me javascript has always felt somewhat cumbersome when used in conjunction with webforms, however, with mvc it is a lot more natural, as it would be with a standard html + javascript + css page.

When you want to create static pages you can use html+css+javascript instead aspx.
In case you want things more dynamic you have to use aspx with cs.
For more info go http://www.w3schools.com/aspnet/aspnet_pages.asp

Is possible to develop whole asp.net web form with jquery

Is it possible to develop a whole asp.net web form with jquery ajax instead of pagepostback?
If possible can anyone show some tutorials or examples?
eg binding data to form (textbox, dropdownlist, gridview etc.), send data to server, etc.
Thank you for your support and Sorry if my english is not good
Zabahey

In my experience, if you are doing that much with jquery you'll do much better trying MVC, as this allows you to work much closer to the HTML (important when marrying to jquery) and avoids all the cruft that is meaningless with a jquery-centric app. It is also much easier to write the ajax routes.
But to answer the question: I'm sure that would be possible, but it will be easier without webforms adding work for you to undo.

You can make a web page or should I say simple HTML markup which can use JQuery or any other Javascript Library to load dynamic content from Database. Yes, you can create dropdown's, checkboxes too, but then you have to be very much efficient in Javascript, HTML and DOM knowledge. Because, you can not debug errors rapidly in this case. Also, you need to
understand the asynchronous behaviour of browsers too.
Its just a complete different pool of water to swim in.

Alternatives to UpdatePanel on a user control (ASCX page)

I am currently working on a ASP.NET AJAX application. Having decided to not use UpdatePanels for evident reasons, what alternatives to I have? This application has pages built dynamically and so most or all the components of the page exist as User Controls.
I need to make AJAX calls from ASCX user control page. And as ASCX user controls may not contain Page Methods, what other options do I have?
Or, is there a way to get around using Page Methods in ASCX page?

You can't call webmethods from a UserControl as you said. The reason for this is methods marked with the WebMethod attribute must also be static. UserControls don't support this. If you aren't willing to use an UpdatePanel, you don't have a lot of options.
You could make AJAX calls via jQuery to web services? This would be one option...
UpdatePanel controls used with UpdateMode="Conditional" gives you fairly good control over what is happening with the callbacks and is still a reasonable solution. It won't be as lightweight as a straight ajax call but will be easy to maintain, etc.

jQuery AJAX is my recommendation, used with web services provides a nice solution.

Best way (that I discovered) is to
1. Place your PageMethods on the parent page
2. When the PageMethod completes, let your user control know via a JS method that it can the PageMethod call has been completed
3. Then a ICallbackHandler can be implemented on the user control to do a AJAX callback on the user control's method
In my case, I need to update some values on the user control after the PageMethods gets executed, so I build my user control using HtmlOutputWriter to update the contents.
Works for me!