AJAX, IIS, ASP.NET - asp.net

I'm dipping my toes into web development. Based on various bits of advice, I'm going to start by getting a handle on html, css and javascript.
I'm interested in Ajax, I've had a look at the client side code and that looks straight forward enough, I'm slightly confused about what I do on the server side.
I'm using IIS and ASP.NET. I've had a google but I can't find anything that is either simple or current. There's a lot of talk about the Ajax toolkit, which I believe are controls which use Ajax (and may be retired??) Everything else seems to be based on old versions which I don't trust.
So, in really simple terms, what do I have to do in IIS to respond to an AJAX call?
Quick aside, I believe we can use JSON for object serialisation?? I assume I don't need to in the interests of getting a simple sample running?
So I have an Ajax call which will have one parameter, and I want to return "something" based on the parameter. What is the simplest code to achieve that with IIS and ASP.NET?
Thanks

An AJAX call is basically just a regular call to your website. The only difference is how the browser handles it - AJAX calls are done in the background with Javascript (the J in AJAX) and then does something with the data. You could take the URL that you're doing an AJAX call with and put it in your address bar and it'll return the exact same data. So, basically, what you do on the server side is exactly what you would do as if it were a form being submitted, for example.
As far as object serialization, yes, JSON can do that.

First of all, doing ajax has nothing to do with IIS; it has to do with ASP.NET.
There are essentially 2 ways to do AJAX in .net
1) Heavy use of the framework. You can put your asp controls (such as literals, gridviews, listbox...) in a control called an updatepanel. For this to work, you need to add a script manager to the aspx page. Then, when the user raises an event (for example, paging and sorting of a table), the request is handled by the framework and only the part of the page that's in the updatepanel is refreshed. The other way to raise events is by using the __doPostback function that comes with the asp.net framework. The downside of this method is that a lot of data needs to go back and forth between the user and the server so it can be slow. The upside is that you don't have to worry about generating the HTML since the asp controls handle it for you.
2) Heavy use of Json. With this method, you can use jQuery to call a page method or a web service. You send a json object to the server and you get a json object back. With jQuery, this is really easy. The downside of this method is that you're getting just the json data back: no formatted HTML. So, if you're looking to have a table updated, this method would be tedious because you'd have to recreate the entire HTML. However, the upside of the method is that it's very fast because only the raw data is transmitted. If you implement a web service, you don't even need to create an entire page.
What do you need to get from the server?
If you want to return "something" from the server that's "simple" (just data), I'd recommend a web service with jquery to trigger the call. If the return data is "complex" (html code for controls) then I'd recommend using MS ajax with the update panel.

Don't use the AJAX Control Toolkit, ASP.NET AJAX library, updatepanels or the scriptmanager control. Microsoft have pretty much ditched the lot in favour of jQuery and its Plugins (sensibly).
Here are just some of the ways you can use AJAX with jQuery in ASP.NET: Many ways to communicate with your database using jQuery AJAX and ASP.NET

Related

Is it possible to update this ListBox without Postback after the database records change?

I have VB.NET web page in my back-end which has a dynamically filled ASP ListBox Web Control. Is it possible to update this ListBox without Postback after the database records change by a form in modal/dialog?
Which way should I try and is there any topics related to the issue/concept?
2 ways i know that could work are ajax and websockets.
Of the 2 ajax is easiest but it creates more overhead as it will be driven clientside.
Your client will submit an ajax request to the server every second, 2 seconds ...
If the server has new data it will return this data and your clientside javascript code can handle the response and create new rows etc.
Since HTML5 you can also make use of websockets. Websockets are server driven so there is no overhead. But starting a websocket server is a little more new/complicated then ajax.
Don't let that scare you though !
This is a small websocket example
Here is an ajax implementation with jquery
*update : Assuming that your are using webforms(which makes your html code more obscure and thus your solution more complex hint go mvc hint) you could also opt for asp updatePanels.
They are basicly perform an ajax call but can be a pain to implement in complex scenario's(like dynamicly generated data ;) )
*update 2:
Changing your html client side can be done with jquery.
An example of adding a value to a selectbox :
$('#listbox').append('<option value="5">item 5</option>');
But beware of problems arising with the use of webforms! You're new fields and controlls will have to be compliant with asp.net webforms and this can turn out to be a pain.

Regarding PageMethod in asp.net

I have a few questions regarding PageMethods. I am learning the use of PageMethod.
Why can't PageMethods be called from user controls?
If server-side controls and viewstate can not be access from PageMethods, what is the use of PageMethods? If I need to update the UI with javascript after response back from a PageMethod, then we have to write lots of script all the time when we work with PageMethod.
So please tell me in what kind of situation we should use PageMethod.
Here is a simple example of the benefit of a PageMethod, inspired by functionality stackoverflow.com has.
When you type in the Tags textbox, tags that match some of the text you started to enter begin to appear. This could be handled in a PageMethod (although, in SO's case, it would not be, as they use this functionality in multiple places on the site, so it is very likely its very own web service). No extra scripting is needed: you simply call the PageMethod in your jQuery AJAX call like you would any other web service, except the URL for the service is the same as the page (plus the method name).
For an example of this, see http://dotnetslackers.com/articles/ajax/Using-jQuery-with-ASP-NET.aspx

How to programming in asp.net with js in client side, with ajax technology?

I'm want to build web site in asp.net(because I know this language) in server side, and js (probably jquery) in client side, with Ajax technology.
I heard that ASP.NET AJAX is too slow, if it's true (is it?) - what are the other options (to combine ASP.NET and Ajax) for me?
Which tool combine all that technologies?
thank u,
and sorry about my poor English.
I agree that the update panels and ajax in .net are not the nicest things to use. As an alternative you could use jQuery or just javascript.
Similar to my answer to this post here is a little synopsis of how to do an AJAX call in .net:
write a server side script (ashx probably) that returns the AJAX response.
use JavaScript (or a library like jQuery) to do the AJAX call to the ashx page. This call will need to pass the query variables to the server via POST or GET. In jQuery there are lots of built in functions for this, such as $.get(), $.post(), $.load() etc...
attach this AJAX call to whatever events you want it to on the front end. Usually a click, but could be a change or a focus
when the AJAX call is completed you will need a JavaScript function that sorts out the returned data. This data could be simple HTML that is added to the page or a more complex JSON object that needs to be formatted. The choice is yours. But this formatting and response needs to be written in JavaScript. in jQuery this function is usually a callback function to one of the AJAX functions. So it automatically gets called when the response has been returned. ie. $.post()
I'm not too sure about the speed and ASP, I can however recommend that you use jQuery for Ajax related development.
MS Studio also seems to have solid support for this, otherwise you could always just install the relevant plugins in Netbeans.
http://jquery.com/

Is it Asp.Net or Ajax or can both technologies be used together when developing web sites?

1) A while ago I’ve started learning Asp.Net, but then I’ve heard that Ajax is “the new thing”. Since I don’t want to throw away the time I’ve invested into Asp.Net, I’d like to know if it is a common/recommended practice to use both technologies ( Asp.Net and Ajax) when creating websites and web apps in general?
2) If it indeed is a common practice to use the two technologies together, is that only true for server-side Ajax and Asp.Net or can client-side Ajax also be used in conjunction with Asp.Net?
thanx
EDIT:
A)
The only problem is that it can be a
bit trickery to do ajax request using
jquery when using asp.net
webforms(asp.net mvc was designed with
frameworks like jquery in mind so it
is easier to do).
Are you implying that perhaps jquery could be too much of a hassle when used together with webforms and thus I should think of using Asp.Net Ajax instead?
B) Little I read on ajax is that it also needs to call web services or some other technology that provides similar functionality to web services. If true, which technology do you use ( WCF or Asp.Net web services or … )?
C) Is Ajax a subsection of jquery? Thus, to understand Ajax, will I need to purchase only a book on jquery or will I also need to read a book with Ajax in its title?
You can use both, and it is common to use both. MS has a toolkit around using AJAX on asp.net sites:
http://www.asp.net/ajax/
1) Yes it is common to use Ajax and Asp.net on the same website. I do it all the time(in fact if you turn off javascript on my sites they won't work too well as so much is AJAX). AJAX allows for requests to the server to be made without refreshing the page you still need a serverside language to do stuff with that request. You also need the load the page for the first time so asp.net controls still are needed and in fact if your using asp.net ajax then you can use update panels where you put controls into that automatically become ajax enabled.
2) I am not sure what you mean but Ajax is mostly javascript so it lives on the client side and sends requests to the server side.
Edit
Ok I skimmed most of the stuff in those chapters. AJAX server side is where most of the rendering is done on the server side. So the update panel is an ajax server side control. You drag it on to your webform throw some other server side controls into it and a button. If a user then clicks on that button in the update panel an ajax request is made to the server and you can grab all the stuff you need and use C# to change it. You never have to write one line of javascript code to make that happen.
Of course that has a price though for instance an update panel does not do a true ajax request because of the page life cycle. If you actually watch the code through the debugger you will notice it will go through the page life cycle but in the end will just rerender that update panel so there is a bit more over head then if you did it yourself.
Client side Ajax is basically Microsoft trying to make it easier for you to do javascript by trying to make it more like C# syntax and giving you built in methods. A problem is that alot of people throw the buzz word Ajax too often around and call stuff that should not be called Ajax when it should be just called javascript.
This seems to be the case with this client side ajax as most of what I seen in the client side ajax chapter is almost all javascript. Like in "Figure 33.8. Selecting a menu item." all it seems to be is your click on a choose then it displays the name of that button that is not really Ajax.
Ajax to me is when you actually make a server request to post or get some information with out the page refreshing(ie full post back). For example if you got a form of data that you want to send to the server to be saved in a database. If you would hit the save button and that form data would be sent to the server without the page refreshing then that would be an Ajax request.
Most of the stuff in the ajax tool kit is more javascript
http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/Calendar/Calendar.aspx
For instance the calendar control to make it select different dates it is not doing any sort of request to the server since it is all javascript so why would it be ajax if it never posts to the server?
If you would take the value in the textbox that the calendar control puts the date in and post it to the server without refreshing the page that would be an Ajax request.
Finally I would not be too worried about asp.net webforms going anywhere anytime soon. I believe the guy who wrote that article about asp.net going to dye is the guy who made Ajax or was involved some how with the development of Ajax so he is probably biased.
Besides look its been 5 years now since he posted that and asp.net is stronger then ever. Ajax still needs a server to connect to, you still need to render the initial page load with either straight html or asp.net server controls.
Edit 2
1) Yes I think jquery is better the MS ajax for a couple reasons:
It uses less resources then drag and
drop controls
It simplifies javascript alot as it
makes it easier to use(such as
selecting html controls,etc). So if
I was using MS ajax I probably still
be using jquery for the selectors it
has so it is kinda redundant to use
both unless you have a good reason
too.
The only problem is that it can be a bit trickery to do ajax request using jquery when using asp.net webforms(asp.net mvc was designed with frameworks like jquery in mind so it is easier to do).
2) You really only need to learn jquery and not even javascript. I read a javascript book in like a day then jumped into jquery without even doing on exercise in the book and never did javascript before and I had no problem doing jquery. Of course if you got javascript experience it is a plus since sometimes you will be trying to find a jquery solution when javascript already has a method for what you want to do.
Edit 3
A)
The only problem is that it can be a
bit trickery to do ajax request using
jquery when using asp.net
webforms(asp.net mvc was designed with
frameworks like jquery in mind so it
is easier to do).
Are you implying that perhaps jquery
could be too much of a hassle when
used together with webforms and thus I
should think of using Asp.Net Ajax
instead?
No I am not implying that it is too much hassle for webforms was just stating the fact that it will be a bit more tricky in certain situations then ms ajax and jquery with say asp.net mvc.
asp.net webforms was not really made for a framework like jquery and has trouble dealing with it because of it's page life cycle gets in the way. MS ajax might have it's own set of challenges though too(like everything usually does). Jquery was made in mind of to try and work across all browsers since in javascript many times you would write something that worked in IE but did not work in any other browser and I am not sure if MS ajax client side version thought about this.
B) Little I read on ajax is that it
also needs to call web services or
some other technology that provides
similar functionality to web services.
If true, which technology do you use (
WCF or Asp.Net web services or … )?
Yes this is true. This was the whole point many people including me where trying to make to prove that guy was wrong that asp.net was dying because of ajax, since you need something in the back end to make a call too.
However you can choose whatever you want. You can make a separate web service( can be a asp.net web service), you can have like static web service methods in your page load ( I never done this way) and the way I use to do it is by making a generic ajax handler.
You can't however just make a regular method in your page_load and try to call it as it has to go through the entire page life cycle.
http://encosia.com/2008/05/29/using-jquery-to-directly-call-aspnet-ajax-page-methods/
http://weblogs.asp.net/craigshoemaker/archive/2008/11/07/using-jquery-to-call-asp-net-ajax-page-methods-by-example.aspx
http://dotnetslackers.com/articles/ajax/using-jquery-with-asp-net.aspx
http://sites.google.com/site/spyderhoodcommunity/tech-stuff/usingjqueryinaspnetappswithhttphandlersashx
I have not read these tutorials but these tutorials should show you the 3 different ways you can do an ajax request to an asp.net webservice, asp.net code behind page and asp.net generic handler.
Choose what ever one you think is best. I don't know if one way is better then another and there probably are more ways to do it.
C) Is Ajax a subsection of jquery?
Thus, to understand Ajax, will I need
to purchase only a book on jquery or
will I also need to read a book with
Ajax in its title
Ajax is just part of jquery and probably won't take you long to learn. If you buy a book about jquery there will probably be like 1 chapter on it. The only down side is all the jquery books I know of are all in php.
So if your just buying it to learn the ajax part probably not worth it since they will show an entire example of how to do it with php that might be slightly different then if you did it with asp.net( mostly just setting up the server side to accept the jquery calls- see the links that I posted above).
If you want to learn jquery selectors and stuff then it does matter if the one chapter is in php since it's all client side stuff expect for the ajax part( what is client side and server side).
It's not hard to really do the ajax stuff it just knowing what path you need to choose and more how to accept stuff on the server side and return stuff from the server side.
$.post("test.php", { name: "John", time: "2pm" },
function(data){
alert("Data Loaded: " + data);
});
The above is basically all you need to do on jquery side to send some ajax stuff. The first parameter is the path where this request should go. In this case its some php file called test. The next parameter is the the actual data sent as a json result and finally the last line is the function call back line. When the ajax post request is done that line gets called and does the actions. Data is the returned stuff you sent back from the server.
http://api.jquery.com/jQuery.post/
So I would just go through the tutorials I posted and play around with the jquery selectors. Once you done that you can decide if you want to go with jquery or not. The last thing I wanted to point out about why I like jquery is the fact that if you learn the MS ajax stuff your basically stuck with asp.net( what I have no problem with since I love .Net) but with jquery you can easily take your code or those skills of jquery and use it with php, ruby or whatever else and all the client side jquery selectors won't change by switching a different language. The only thing that will be different is the ajax stuff and even that won't be 100% different as the jquery ajax client side could will be the same.
Ajax is a methodology which can be used in conjunction with with other frameworks, such as asp.net. Asp.net will allow you to integrate javascript to implement ajax solutions.
A common implementation is to use javascript to call an asp.net webservice to perform ajax operations.
Ajax is the new "old thing" - ASP.NET MVC is the new "new thing" :-)
But seriously, you can mix all of these technologies in one web application if you want:
"classic" ASP.NET (WebForms)
Ajax (using ASP.NET Ajax controls other approaches such as jQuery)
ASP.NET MVC.
AJAX is a technique essentially added on top of an existing website to allow things to be done on that page without refreshing the entire page. Here on StackOverflow, for example, you can vote by clicking the up/down arrows via AJAX, without the page refresh you'd have seen without AJAX.
It doesn't replace ASP.NET (or any other language).
AJAX does not replace ASP.NET. They can be used together or independently. ASP.NET is more of a framework, where AJAX is a set of techniques built on top of JavaScript and HTML.
There is a framework that Microsoft has called ASP.NET AJAX. There are controls that will output JavaScript so that if you wish, you can have AJAX functionality without having to get too far into JavaScript.
However, you could also write the JavaScript by hand and use XMLHttpRequests to send requests to ASP.NET URLs and get data back.
ASP.Net is primarily a server-side technology stack which dynamically generates most of the client-side code. The out-of-the-box ASP.Net 2.0 page model is a fairly painful way to implement AJAX-enhanced user interaction (though there are techniques, such as custom handlers, that make it pretty tractable). Both the ASP.Net MVC and ASP.Net AJAX frameworks provide helpful tools for making it lest troublesome.
AJAX is commonly used to describe any asynchronous, partial-page-interaction technique to build the user interface of your application.
The server-side technology and the client side technology choices are fairly independent, though different techniques for how to work with a client side technology become attractive with different frameworks on the server.

How to call a asp.net page asynchronously using JQuery

I want to call a aspx page method asynchronously using JQuery
You can use AJAX in jQuery to call a page method without too much trouble. Though I guess it depends on what you're trying to do. Sometimes it's better to contain your asynchronous methods inside a web service or web handler instead of the page.
I've posted on how to do this here. But it's not an example on how to do it with a page method, though the process is very similar.
BTW, a quick web search will turn up MANY results on what you're trying to do.
This example is very good.

Resources