Partial loading of ASP.NET without updating the panel / Using jQuery

Question

I have an aspx page. At the top, I show 5 categories (for example: pen, book, shoes, mobile phone, mirror) When I click on any of the categories, I want to show products under this category under the heading. I do not want to reload the entire page for this. I want my page to be what it is (there will be a header and footer and sidebars) when the click occurs, except for the central place of the image (maybe a DIV or Table to show the Product). What is the best way to do this? I do not want to go to the ASP.NET Ajax update panel. I am already using jQuery in my project. Anyway, to do this using jQuery? Please advice. thanks in advance

Answer 1

As Kirtan mentioned, the easiest answer is to use the update panel.

If you do not want to go this route, you can use jQuery to call Ajax in IHttpHandler, which returns the data needed to populate the panel that you want to update.

The steps will look like this:

• Use jQuery to call A handler .ashx.
• Ask your file to < .ashxcreate an answer in the format of your choice. This can be JSON or XML (if you want JavaScript to parse the response and generate a list), or the HTML content itself that will be added to the page.
• jQuery .

IHttpHander. , ASP.NET "Page". , Page, , UpdatePanel, , , .

, IHttpHandler.

Answer 2

• - jQuery

• jQuery.

, - (, ), UpdatePanel AJAX.

Answer 3

, UpdatePanel, Repeater/DataGrid/GridView, .

jQuery. CateogryId ajax , JSON div JSON DOM-.

EDIT: JSON - . -

var person = {
     "firstName": "John",
     "lastName": "Smith",
     "address": {
         "streetAddress": "21 2nd Street",
         "city": "New York",
         "state": "NY",
         "postalCode": 10021
     },
     "phoneNumbers": [
         "212 555-1234",
         "646 555-4567"
     ]
 };

person - JSON, : "firstName", "lastName" .. person.firstName, person.lastName ..

JSON, , JSON, , . , -

var persons = [person1, person2, person3, ...]; //person1, person2, etc. are objects like the person object declared above.

DataContractJsonSerializer ( Framework 3.5) / JSON . Framework < 3.5, JavaScriptSerializer AjaxToolKit .

Answer 4

" " : ICallbackEventHandler html, div .

Update. See http://msdn.microsoft.com/en-us/library/ms178208.aspx for more information on what you need to implement.