Access property of an object of type [Model] in JQuery

Question

So in my MVC project I have a custom Model called Survey, which contains a handful of properties. In the Survey Controller, I am saving Survey to a Session variable, so that the values of the survey's properties are persisted per session.

I want to be able to manipulate the DOM of a View based on the values of the session survey's properties. But I'm having trouble with how to access those.

I did find this relatively recent question that seems very similar but doesn't have an answer: Cannot access properties of model in javascript

Here's what I have so far: In the View I am getting the session's survey like so:

     <input type="hidden" name="activeS" value="@HttpContext.Current.Session("Survey")" />

Then in the Section Scripts at the bottom I have this script to get that value and do something with it:

 @Section Scripts
@Scripts.Render("~/bundles/jqueryval")

<script type="text/javascript">
    $(function () {
        var survey = $("[name=activeS]").val();
        $("[name=mddbccu][value=" + survey.mddbccu + "]").prop('checked', true);
    })
</script>

 End Section

If I insert "alert(survey);" after "var survey..." It does give me an alert that displays the type that the survey object is. So it looks like the survey is being retrieved fine. But if I try "alert(survey.mddbccu);" the alert simply says "undefined".

Note that the line after that ("$([name=mddbccu]...") I know works - having previously set a variable to a specific value, using that the appropriate item is checked. But in attempting to get the value of this particular property of the survey, nothing is checked.

So how do I get the values of the survey's properties here? Thank you!

Your javascript val() is just going to return a string, not an object. It will not contain the properties you need if Session("Survey") is a C# object. You will have to serialize the individual survey properties that you need into separate hidden fields or come up with some other solution — Brad C, Jun 08 '15 at 20:37
@br4d - thank you. If I were to go the route of serializing each individual property as a hidden field in the view, how would I access those in the razor then? Or do you have a recommendation for some other solution? — Andy, Jun 08 '15 at 20:50
If the view itself is changing depending on the session, you might want to consider moving that logic into a ViewModel (and populating it in the Controller's action method) instead of just doing all that logic in the view itself using razor. — Brad C, Jun 08 '15 at 20:58
@br4d - If I use ViewModels instead, do I not still have the problem of having to specify what radio buttons are checked based on the values of the session's variable? How would I go about doing that? — Andy, Jun 09 '15 at 15:18

score 2 · Accepted Answer · answered Jun 09 '15 at 16:32

Your approach would work with some hackery and workarounds but it is not in the spirit of MVC. Here is how you could accomplish it in the MVC way. Basically you move all the heavy lifting (parsing the item from the session) 0 to the controller and store the results in a ViewModel. This keeps the logic out of the view and makes for much cleaner and easier to maintain code.

If you have a ViewModel:

public ActionResult Survey()
{
    SurveyViewModel model = new SurveyViewModel();

    Survey surveySession = HttpContext.Current.Session("Survey") as Survey; // youll have to do extra null checks and such here

    // map other properties from the survey object retrieved from the session to your viewmodel here!
    model.mddbccu = surveySession.mddbccu;
    model.otherProperty = surveySession.otherProperty

    return View(model);
}

If you are just using the Survey object as the model inside the view then its even simpler:

public ActionResult Survey()
{
    Survey model = HttpContext.Current.Session("Survey") as Survey;
    return View(model);
}

Then, MVC magically selects stuff for you depending on what you have set in the controller. If you are using @RadioButtonFor(m => m.mddbccu, "three") then the radio will be selected if the value "three" was put into the property mddbccu in the controller.

oh, man...that is such a better way to do it! I was able to get it working using the approach of making the Survey object the model inside the view. I admit there is still a lot about MVC I don't fully understand...but this certainly helped. Thank you so much! — Andy, Jun 09 '15 at 18:13

Access property of an object of type [Model] in JQuery

1 Answers1