jquery multiselect not retaining selection after postback

Question

I am having a problem with bootstrap multiselect control after postback. in my view, there is a dropdown like

@Html.DropDownListFor(model => model.SelectedReportToRoles, Model.NotificationReportToRoles, new { multiple = "multiple", @class = "select-optional multiselect", @id = "ddlReportTo" })

and, when i select multiple items from the ddl and save it to DB, and then come back to the page, i can see only first item in my selected items only displayed as checked in the ddl. if i refresh the page it behaves as needed. ie, the ddl displays all items from the DB as selected (like 3 items selected)

my controller action is like

   [HttpGet]
    public ActionResult Create()
    {
        return this.View(this.GenerateViewModel());
    }

    private static NotificationSettingsViewModel GenerateNotificationSettingsViewModel()
    {
        NotificationSettingsViewModel notificationSettingsViewModel = new NotificationSettingsViewModel();

    // Getting the roles from DB and assigning that to int array selectedReportToRoles

    notificationSettingsViewModel.NotificationReportToRoles = new MultiSelectList(roles, "RoleID", "RoleDescription", selectedReportToRoles);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create(NotificationSettingsViewModel notificationSettingsViewModel)
    {
          // Save to Db
          return this.View(this.GenerateViewModel());
    }

I am using jquery version 1.8.2

Any help is appreciated.

Answer 1

I solved the issue by saving the changed parameters to TempData and then redirecting to the Get action from my post action.

return this.RedirectToAction("Create");