How to pass an object from a mvc controller action to a view using jquery

Question

Can someone help me out I'm new to jQuery, I would like to know how can I pass an object through from a controller action MVC

public ActionResult UserGroupSetting()
{
    UserGroupSetting setting = //some code to retrieve the settings
    ViewData["Theme"] = setting.Theme;
    ViewData["Image"] = setting.LogoImage;
    returnView(setting);
}

What I want its to get the Theme and the logo image, in a jQuery function, that I will use to update a class in a stylesheet, The theme object contains a colour in Hex form only for now.

If someone can please help me with the call to a jquery function and how will I expose both the image and the theme objects in jquery.. Thanks

sorry for the being in line with my question, couldnt get it to be structured properly here. — vudz
– vudz, Commented May 14, 2012 at 20:40
You can't pass server objects directly to a javascript function. What you could do however, is make an Ajax call from the loaded page to the server that would return the objects — Blast_dan
– Blast_dan, Commented May 14, 2012 at 20:49

Shyju · Accepted Answer · 2012-05-14 20:51:51Z

3

You can return the data in jSon format and let jquery make a call to your action method with getJSON method

public ActionResult UserGroupSetting()
{
   var result=new { Theme="YourTheme", Logo="YourLogoURL"};
   return Json(result, JsonRequestBehavior.AllowGet);
}

In your page,Call this from your javascript

$(function(){
   $.getJSON('YourController/UserGroupSetting', function(data) {
      alert(data.Theme);
      alert(data.Logo);
   });
});

answered May 14, 2012 at 20:51

Shyju

220k106 gold badges420 silver badges499 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

vudz Over a year ago

Thanks Shyju, will try this and let you know how it goes.

vudz Over a year ago

Thanks again shyju it works perfectly, I tried this for only the theme coz it was giving an error abt the size of the logo image, i will sort that one out, but thanks again ;).

dfang · Accepted Answer · 2012-05-15 05:25:03Z

1

if i were you , i would do this:

you can use ViewBag: in action: ViewBag.Setting = setting;

  UserGroupSetting setting = //some code to retrieve the settings
  ViewBag.Theme  = setting.Theme;
  ViewData.Image = setting.LogoImage;
  returnView(setting);

then in Razor:

 @{
    var setting = (UserGroupSetting)ViewBag.Setting;
  }

output it to javascript tag:

  <script type="text/javascript">
        var setting = new setting{
                 Theme = @setting.Theme,
               Image = @setting.Image
        }
  </script>

answered May 15, 2012 at 5:25

dfang

1,40618 silver badges41 bronze badges

Comments

sazh · Accepted Answer · 2012-05-14 20:51:05Z

0

This may not be the best solution, but one option I've used in the past is to create a hidden input in your view and access the value of the input in your jQuery code. This would be an example of the code you would have in your view:

<input id="someID" type="hidden" value="@TempData["Theme"]" />

answered May 14, 2012 at 20:51

sazh

1,84216 silver badges20 bronze badges

Collectives™ on Stack Overflow

How to pass an object from a mvc controller action to a view using jquery

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related