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
Related
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/
I have a problem with javascript generated web page. I have a web page on the internet that is generated by javascript. I am working on changing a web page using wpf web browser control. I have to make some changes to the web page by inserting jquery, and changing css and hiding some elements.
Here is the issue.
Application works ok most of the time, but sometimes, for reasons unknown, it does not change the css or hides the elements. I presume that it has something to do with the javascript that actually generates the page. My code is executed, but no changes are made, so I presume that the script cannot find the elements in the page because they do not exist in the page, at the time of the execution of my scripts. This is just an assumption.
I need help resolving this issue. I have tried delaying the execution of my scripts for n seconds, waiting for body.ready, document.ready and window.ready, but nothing helped. Also, I use wpf web browsers LoadCompleted event, but... From time to time, the script simply makes no effect on the page. Did somebody have this issue, does anyone have any idea how to solve it?
Thank you very much in advance...
When building single page apps, always use a framework like Backbone or Sammy.js together with Mustachejs (or Hogan.js) for templating.
Since we don't have any code to look at, if you're using jQuery, I suggest you check out .live() and .on() for attaching event handlers to elements you plan on loading into a div (making them clickable) etc.
In chat scripts new lines adds without reloading page. User's availability status changes without postback. Even in facebook a new comment adds without reloading page. How to fire an event in ASP.NET using C# so that event takes place with reloading the page.
I believe that its not possible using C#. Is there any special library for it in AJAX or jQuery or other?
It's done using native XML components available from the browser when writing JavaScript. These are used to call a server-side page or service to load a block of HTML (or XML) async, and then write it into the document. This is essentially AJAX.
JQuery is a library designed to make writing cross browser compatible scripts easier, and offers built in functionality to help make those AJAX calls for you, without you needing to do the low level bits yourself.
ASP.NET has a range of tools for creating AJAX enabled sites, and recent versions now incorporate jQuery for the client side parts, without you needed to do much wiring up. Together the tools make exposing and calling ASP.NET services really easy. The simplest form is probably the UpdatePanel. It's a good place to start if you have never made an AJAX enabled site before.
Also take a look at the AJAX Toolkit.
jQuery itself allows you to send GET and POST Ajax requests and manipulate with HTML elements
$.post(...
$.get(...
I'm trying to convert a classic ASP page to ASP.NET 3.5. The page has several forms on it for several different things.
In ASP.NET, there's a server form control wrapping the entire page, and form controls don't work within a server form control, and you can't have more than one server form control on a page.
So in order to keep this functionality, I can either:
Remove the server form control that's wrapping the page, and leaving the html forms on the page.
Create button click events for every form and perform the POST in the code-behind.
What's the preferred method here?
I wonder if converting to vanilla asp.net (aka webforms) is a bad idea here. Personally I'd go to MVC instead - allows multiple forms etc, and the views are much closer to he HTML, a lot like ASP.
I guess I'm saying there are some glitches vanilla asp.net introduces that you don't have to suffer.
I would go with the second option, any button click is going to post the whole page back anyway so you're not saving any bandwidth. Simply handle each button appropriately.
Check the answer I provided to a similar question here :-)
How to get past embedding a html form for paypal buttons asp.net
If you're going to use different button clicks, you still need to use this override to disable the non-related buttons in each handler, otherwise it won't work. You can only have one form tag at a time - this way you can toggle/disable the ones you're not using as appropriate.
Better still, refactor your application to use a single form. While MVC would be a closer match to the model you're using right now, it wouldn't make sense to go that route unless you were experienced enough with it; Web Forms is an easier jump.
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!