Invisibly sending data back to server - without generating postback.

Question

I've got a simple function in javascript on my asp.net page that writes some data to hidden field on a page. To get this data the form must be sent back to server. The problem is that submitting the form results in reloading the page and I wouldn't like my client to experience unnecessary postback. So i assume that it can be made using AJAX - is it possible that only part of my page will execute javascript and invisibly send data to server without reloading the whole page? And if it is, could you please explain how or at least provide any sources where I could find the details?

Answer 1

yes this is possible, you would basically do the ajax request in your javascript function, without having to reload the page or anything. this is standard ajax practice.

I would look into Jquery, it's a javascript library that wraps a lot of javascript functionality and simplifies writing code specially for ajax.

check http://docs.jquery.com/Ajax for reference.

Answer 2

You are on the right track this is indeed accomplished using ajax. Since you used the term postback I assume you are using asp.net webforms. There is a accompanying library asp.net ajax which you can find more about at http://www.asp.net/ajax/ you can start learning how to use it at http://www.asp.net/learn/ajax/tutorial-01-cs.aspx

just like webforms is a abstraction of http so is asp.net ajax to ajax. Although it certainly makes some things easier it can also make other things not envisioned by the authors harder then they need to be. For more advanced ussages you might want to check out jquery at http://jquery.com/ which goes together great with asp.net MVC. There are also allot more information, samples and libraries in the public domain for jquery then for asp.net ajax. But asp.net ajax should get you on your way fastest if you already have a webforms codebase.

Answer 3

If you are using ASP.NET, they have made it pretty easy to get started with ajax -- the Ajax controls can be added to VS 2005, and the controls come with VS2008.

Check out http://www.asp.net/ajax/ for instructions/videos detailing how to use Ajax with ASP.NET. The simplest possible setup is to put an UpdatePanel around your content in the markup, and it will automatically do updates asynchronously on any content inside the UpdatePanel, without postbacks.

Answer 4

W3 SChools has a pretty straight forward tutorial.

Answer 5

Use a javascript library. You can achieve what you want using, for example, the prototype (http://prototypejs.org) library with as little coding as this:

var serialized = $("formId").serialize(true);
new Ajax.Request(
  "your/url/here",
  method: "post",
  parameters: serialized,
  onSuccess: function(response) {alert("data sent");},
  onFailure: function(response) {
    var msg = "Server error on AJAX request: ";
    msg += response.status;
    msg += " " + response.statusText;
    alert(msg);
  },
  onException: function(response, stacktrace) {
    var msg = "Exception in AJAX callback\n";
    for (var i in stacktrace) {
      msg += i + " = " + stacktrace[i] + "\n";
    }
    alert(msg);
  }
);