updating portion of asp.net MVc 4 view with partial view

Question

I am working on asp.net MVC 4 application. I have an action link on my main view like this:

  @Ajax.ActionLink("Get LinkedIn Profile","LinkedIn", new AjaxOptions
                 {
                     UpdateTargetId="partialDiv", // <-- DOM element ID to update
                     InsertionMode = InsertionMode.Replace, // <-- Replace the content of DOM element
                     HttpMethod = "GET" // <-- HTTP method
                 })
            <div id="partialDiv"></div>

and in controller, I have action result which performs redirection to linkedIn and returns to another action result.

  public ActionResult LinkedIn()
        {
            return Redirect("https://www.linkedin.com/uas/oauth2/authorization?response_type=code&redirect_uri=" + HttpUtility.HtmlEncode("http://127.0.0.1:81/Account/LinkedInAuthorized"));
}

now from LinkedInAuthorized I want to return a partialview or some contents which should be inserted in partialDiv, So I am doing like this:

 public ActionResult LinkedInAuthorized(string code, string state)
        {
         // some code here
        return PartialView("LinkedInProfileInfo", returnVal);
        }

But it replaces whole view instead of inserting partial view in that div.

Please suggest me solution to this.

make sure you have a reference to ajax.unobtrusive on your view — Matt Bodily
– Matt Bodily, Commented Jan 31, 2014 at 17:17
@MattBodily Can we render partial view without making ajax call as in my case it is not ajax call. — DotnetSparrow
– DotnetSparrow, Commented Jan 31, 2014 at 17:19
this isn't your typical ajax call but your link has ajax options so it is making an ajax call. It is redirecting instead of populating the div because of the missing reference — Matt Bodily
– Matt Bodily, Commented Jan 31, 2014 at 17:20

Chris Pratt · Accepted Answer · 2014-01-31 17:27:52Z

You need to step back and re-evaluate what it is you're trying to do. It wouldn't hurt to do a little more research into AJAX and OAuth too, because you're obviously not too familiar with those concepts.

First, let's start with the OAuth process. First, you need to direct the user to a page on the provider, in this case, LinkedIn. There, the user will authorize with the provider, who will then post back to a designated page on your site with a payload. Your application deciphers that payload, storing any relevant details, such as an auth token to use in later requests, and then the process is complete. That can't be done over AJAX. Once you have the auth token you can do whatever you want with AJAX, but the initial authorization is synchronous.

Now, your AJAX. AJAX can be thought of as a simple HTTP client. Your browser is also an HTTP client, but much more sophisticated. Part of that sophistication is in providing a seemless user experience, regardless of how many requests are involved behind the scenes. AJAX, however, deals in a simple request-response cycle. Now, let's see why this is an important difference.

A browser requesting your LinkedIn action

GET /url/to/linkedin/action
> HTTP/1.1 302
> Location: https://www.linkedin.com/uas/oauth2/authorization...

GET https://www.linkedin.com/uas/oauth2/authorization...
> HTTP/1.1 200
> (crap ton of HTML)

AJAX requesting your LinkedIn action:

GET /url/to/linkedin/action
> HTTP/1.1 302
> Location: https://www.linkedin.com/uas/oauth2/authorization...

See, the browser knows that since your original URL was redirected, you probably want to actually go there, so it issues another request for the redirected URL. AJAX makes no such assumptions. It sent the request and got a response, so it's done. It's up to you to issue another AJAX request to proceed. So, even if you could use AJAX for OAuth authorization, you couldn't do it like this.

Thanks for the very good explanation. How can I use the json returned by second action result LinkedInAuthorized and update the view div?

Alan006 · Accepted Answer · 2014-01-31 17:22:35Z

0

Try using Html.RenderPartial inside partialDiv. Like this:

<div id="partialDiv">
  @{ Html.RenderPartial("LinkedInProfileInfo", returnVal); }
</div>

returnVal might not be the correct value to there. It could also be Model (sorry I'm new to MVC).

answered Jan 31, 2014 at 17:22

Alan006

1864 silver badges16 bronze badges

Collectives™ on Stack Overflow

updating portion of asp.net MVc 4 view with partial view

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related