Keeping a page's state

Question

I have already looked at these links for references.

Link 1: ASP.Net MVC and state - how to keep state between requests
Link 2: ASP.NET MVC: Keeping last page state

I have a few pages that a user will be filling out. We will call these pages Page 1. If they get to a field that they need to select from, drop down, but need to create a new item to be included in the drop down, because it will be used again later, they go to a new page, Page 2, to create the item. After create they create the item they are returned to Page 1 to finishing filling out the form. The problem is that the Page 1 is now erased because is a new page load. I would like for this to persist for when they come back so they don't have to refill out fields.

The route I am currently Link2 using a cookie. I don't know how to set the cookie's info before it gets to the next page, or how to pass it to that page before since it is going to a GET method and not a POST.

GET method for Page 1:

public ActionResult Create()
{
    var courseTitles = (from title in db.CourseTitles
                        join type in db.CourseTypes on title.Type equals type.CourseTypeID
                        select new 
                        {
                            CourseTitleID = title.CourseTitleID,
                            Title = title.Title + " - " + type.Type
                        });
    Course course = new Course();
    if (Request.Cookies["CourseInfo"] != null) //If it's not null, set the model.
    {
        HttpCookie cookie = Request.Cookies["CourseInfo"];
        course.ClassNumber = Convert.ToInt32(cookie.Values["ClassNumber"]);
        course.CourseStartDate = Convert.ToDateTime(cookie.Values["StartDate"]);
        course.CourseEndDate = Convert.ToDateTime(cookie.Values["EndDate"]);
        ViewBag.CourseList = new SelectList(courseTitles, "CourseTitleID", "Title", cookie.Values["CourseTitle"]);
        return View(course);
    }
    ViewBag.CourseList = new SelectList(courseTitles, "CourseTitleID", "Title");
    return View();
}

GET and POST method for Page 2:

public ActionResult NewCourseTitle()
{
    ViewBag.Type = new SelectList(db.CourseTypes, "CourseTypeID", "Type");
    return View();
}

//
//Post:

[HttpPost]
public ActionResult NewCourseTitle(CourseTitle courseTitle)
{
    if (ModelState.IsValid)
    {
        db.CourseTitles.AddObject(courseTitle);
        db.SaveChanges();
        return RedirectToAction("Create", "Course");
    }
    return View();
}

Let me know if you need more code.

You would get far better performance by using javascript/jquery and ajax to render a popup/dialog form on the same page, save the form data and the update the DOM by adding the new option to the dropdownlist. No redirects and no issues with maintaining state. — , Aug 15 '15 at 00:41

Alex Art. · Answer 1 · 2015-08-14T17:51:20.610

You can use TempData to store objects between requests:

public ActionResult Create()
{
    var courseTitles = (from title in db.CourseTitles
                        join type in db.CourseTypes on title.Type equals type.CourseTypeID
                        select new 
                        {
                            CourseTitleID = title.CourseTitleID,
                            Title = title.Title + " - " + type.Type
                        });
    Course course = new Course();
    if (TempData["CourseInfo"] != null) //If it's not null, set the model.
    {
        course = TempData["CourseInfo"] as Course;
        ViewBag.CourseList = new SelectList(courseTitles, "CourseTitleID", "Title", course.Title);
        return View(course);
    }
    ViewBag.CourseList = new SelectList(courseTitles, "CourseTitleID", "Title");
    return View();
}

In order to store the Course simply use TempData["CourseInfo"] = course

TempData exposes couple of options that define for how long its content is going to be persisted. You can read about it here

Might be a good idea to also mention that you can change the provider for `TempData` to use cookies instead of session state: http://brockallen.com/2012/06/11/cookie-based-tempdata-provider/. — NightOwl888, Aug 14 '15 at 18:15

score 0 · Answer 2 · answered Aug 14 '15 at 22:52

You could use some JavaScript to modify the GET request to NewCourseTitle so that it will contain the course data that the user entered. With jQuery it could look roughly like this:

$(function () {
    var newCourseTitleLink = $('#new-course-title-link');
    newCourseTitleLink.on("click", function () 
    { 
        document.location.href = newCourseTitleLink.attr('href') + '?' + $('#course-data-form').serialize();
    });

});

Then you can create a cookie in your action method NewCourseTitle:

public ActionResult NewCourseTitle(int classNumber, ... /*other form values*/)
{
    var cookie = new HttpCookie("CourseInfo");
    cookie.Values.Add("ClassNumber", classNumber.ToString());
    ...
    Response.SetCookie(cookie);

    ViewBag.Type = new SelectList(db.CourseTypes, "CourseTypeID", "Type");
    return View();
}

Keeping a page's state

2 Answers2

Linked