HelloWorld1
HelloWorld1

Reputation: 14108

Update the Page without refresh it

Goal:
When you click on the row (1), new data shall display (3.) without the whole webpage will be updated/refreshed.

Problem:
1.
I need advice and I don't know where to find the funciton to display the picture number 2 and how to display the data and new object (3.) without update/refresh the whole webpage?

And

2
How do you create an icon to display loading picture?

Information:
- The page is based on ASP.mvc with C#

enter image description here

Upvotes: 0

Views: 4775

Answers (3)

Sarveshwar
Sarveshwar

Reputation: 125

You Can use jquery ajax which would call async action method(function). Data is returned the form of Json. You can write code to deserilize data and display it using jquery. Create a Action method which would return JsonResult as viewresult as

public JsonResult GetJsonData()
{
 return Json(new
                    { testDataResult =TestDataResultObj.Data
                       JsonRequestBehavior
                    }, JsonRequestBehavior.AllowGet);
}

and write following jquery code:- if (GetDataAsyc()) {

                        $.ajax({
                            type: "GET",
                            data: { testData: testDataResult },
                            url: url,// url of action method to be called asynch
                            dataType: "json",
                            cache: false,
                            traditional: true,
                            contentType: "application/json",
                            success: function (data) {

                                   // on success assign  testDataResult to messages //line
                                    $("#MessagesLines").html(testDataResult .Html);

                                }
                            },
                            error: function () {
                                //Display error message
                                $("ErrorMsg").html("There was error whey trying to process your request") 
                            }
                        });
                    } 

Upvotes: 0

activebiz
activebiz

Reputation: 6220

Use ajax functionality of either jquery or MVC ajax helpers.

You can find jquery ajax here.

and MVC ajax helper lib here

and here

you can make an ajax call to the server's websevice and it can return one of the well known web format (for e.g. json or XML). When the webservice call returns you can then "inject" the data in your html page with either javascript (dom manipulation) or using MVC helpers.

Here's one that could help.. http://www.asp.net/mvc/tutorials/older-versions/javascript/creating-a-mvc-3-application-with-razor-and-unobtrusive-javascript

Upvotes: 1

mby
mby

Reputation: 91

Use ajax+PartialViews to update some page sections

Upvotes: 0

Related Questions