MVC 4 DropdownList set selected value and pass the value to the controller through the ActionLink

Question

I have a view with the following.

    @model Scheduling.ViewModel.ReportsViewModel
    @Styles.Render("~/Content/themes/base/minified/jquery-ui.min.css")
    @Scripts.Render("~/Scripts/Reports.js")
    @{
        ViewBag.Title = "Index";
    }

    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />

   @using (Html.BeginForm("ViewReport","Report", FormMethod.Post)) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Reports</legend>
        <div class="editor-field">
          @Html.DropDownListFor(model => model.SelectedReport, Model.ReportList, new { id = "ui_ddlReportsList", style = "width: 25%;" })
        </div>
        <div id ="ui_div_BroadcastReportFilters">
           @Html.Label("Start Date:")
            @Html.EditorFor(model => model.StartDate, new{id = "ui_txt_StartDate" })


        </div>
        <p>
            <input id="ui_btn_RunReport" type="submit" value="Run Report" />  

        </p>

    </fieldset>
}

In my controller I have

namespace Scheduling.Controllers { public class ReportController : Controller {

    private SchedulingEntities db = new SchedulingEntities();
    //
    // GET: /Report/

     public ActionResult Index()
{
    var reportViewModel = new ReportsViewModel();


    return View("Index", reportViewModel);
}    

    /// <summary>
    /// Start method
    /// </summary>
    /// <returns></returns>
    public ActionResult Start()
    {
        return Index();
    }

  public ActionResult ViewReport(ReportsViewModel reportsViewModel)
{

    //ViewData["ArReport"] =
    Reports.ReportList report = 0;
    //if (Enum.IsDefined(typeof(Reports.ReportList), reportsViewModel.SelectedReport.pkReportID))
    //{
    //    report = ((Reports.ReportList)reportsViewModel.ReportID);

    //}



    var arReport = GenerateReport.RunReport(report);
    ViewBag.ArReport = arReport;
    return View("ViewReport"); //, new ReportDescriptor { Id = id, Type = reporttype });
}

}

}

My View Model is as follows

public class ReportsViewModel
    {
        private SchedulingEntities db = new SchedulingEntities();

        public Reports SelectedReport { get; set; }

        public SelectList ReportList { get; set; }

        public string StartDate { get; set; }

        public string EndDate { get; set; }

        public ReportsViewModel()
        {
            PopulateReports();

        }

        public void PopulateReports()
        {
            var reports = db.Reports.Where(r => r.IsActive).OrderBy(r => r.ReportOrder).ToList();
            if (reports.Any())
            {
                SelectedReport = reports[0];
            }
            ReportList = new SelectList(reports,"pkReportID","ReportName", SelectedReport);// db.Reports.Where(r => r.IsActive).OrderBy(r => r.ReportOrder).ToList();



        }


    }

Update ok I am now using a view model. I can get all the editFor Fields to populate but the dropdownFor selectedValue is always null when it gets to the controller?

Answer 1

Ok figured it out. What I did was in my controller I populated the dropdownlist. in my viewModel I have all the properties I need to pass to the next view.

This is my controller code

  public ActionResult Index()
        {

           var reportList =  PopulateReports();
           var reportViewModel = new ReportsViewModel { ReportList = reportList };


            return View("Index", reportViewModel);
        }


        /// <summary>
        /// Start method
        /// </summary>
        /// <returns></returns>
        public ActionResult Start()
        {
            return Index();
        }

    /// <summary>
    ///  Returns View ReportViewer.cshtml
    /// </summary>
    /// <returns></returns>
        //public ActionResult ViewReport(int reportID, string startDate)
        public ActionResult ViewReport(ReportsViewModel reportsViewModel)
        {

            //ViewData["ArReport"] =
        var report = (ReportsViewModel.ReportNamesList) 0;
        int reportID = int.Parse(reportsViewModel.SelectedReport);
        if (Enum.IsDefined(typeof(ReportsViewModel.ReportNamesList), reportID))
        {
            report = ((ReportsViewModel.ReportNamesList)reportID);

        }



            var arReport = GenerateReport.RunReport(report);
            ViewBag.ArReport = arReport;
            return View("ViewReport", reportsViewModel);
        }


  private SelectList PopulateReports()
        {


            var reports = db.Reports.Where(r => r.IsActive).OrderBy(r => r.ReportOrder).ToList();
            Reports selectedReport = null;
            if (reports.Any())
            {
                selectedReport = reports[0];
            }
            var reportList = new SelectList(reports, "pkReportID", "ReportName", selectedReport);
            //, SelectedReport);// db.Reports.Where(r => r.IsActive).OrderBy(r => r.ReportOrder).ToList();

            return reportList;

        }

This is my ViewModel

 public class ReportsViewModel
    {
        #region Declaration/Initialization

        private SchedulingEntities db = new SchedulingEntities();

        public enum ReportNamesList
        {
            test1= 1,
            test2= 2,
        }
        #endregion Declaration/Initialization

        #region Properties

        public string FilterEndDate { get; set; }

        /// <summary>
        /// Holds the values of the reports used to populate controls like the dropdownlist.
        /// </summary>
        public SelectList ReportList { get; set; }

        /// <summary>
        /// Holds the selected value of the dropdownlist control.  Needs to be a string or it doesnt work.
        /// </summary>
        public string SelectedReport { get; set; }

        public string FilterStartDate { get; set; }
        #endregion Properties

        #region Constructor

        public ReportsViewModel()
        {
        }

        #endregion Constructor
    }

This is my view

@model Scheduling.ViewModel.ReportsViewModel
@Styles.Render("~/Content/themes/base/minified/jquery-ui.min.css")
@Scripts.Render("~/Scripts/Reports.js")
@{
    ViewBag.Title = "Index";
}

<br />
<br />
<br />
<br />
<br />
<br />
<br />

@using (Html.BeginForm("ViewReport","Report", FormMethod.Post)) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Reports</legend>
        <div class="editor-field">
          @Html.DropDownListFor(model => model.SelectedReport, Model.ReportList, new { id = "ui_ddlReportsList", style = "width: 25%;" })
        </div>
        <div id ="ui_div_BroadcastReportFilters">
           @Html.Label("Start Date:")
            @Html.EditorFor(model => model.FilterStartDate, new{id = "ui_txt_StartDate" })
             @Html.Label("End Date:")
            @Html.EditorFor(model => model.FilterEndDate, new{id = "ui_txt_EndDate" })

        </div>
        <p>
            <input id="ui_btn_RunReport" type="submit" value="Run Report" />  

        </p>

    </fieldset>
}

Answer 2

to include a selected value in an action link you need to use jquery. so in your view change

@Html.ActionLink("Run Report", "ViewReport", "Report",new { reportID = Model.pkReportID}, null)

to

<a class="linkButton" href="#">Report</a>

and then in your javascript

$('#pkReportID').on('change', function(){
    var url = '@Url.Action("Run Report", "ViewReport",new { reportID = "----"})'.replace("----", $('#pkReportID').val());
    $('.linkButton').attr('href', url);
});

this will change the href of your link based on the selected item in the dropdown. Let me know if you have any questions.