根据单击的按钮在View中显示数据:ASP.NET MVC3 RAZOR

时间:2012-02-21 06:44:30

标签: asp.net-mvc asp.net-mvc-3 razor

我有一个Program Scheduling视图。当使用GET加载视图时,它会显示数据库中可用的程序列表(在表中)。它随机列出了5个程序(最大值)。提供了两个按钮

  1. 显示March程序。单击此按钮时,表格应仅显示计划在3月份的程序。

  2. 显示2012年计划。单击此按钮时,该表应仅显示计划在2012年的程序。

  3. 我们如何实现它?

    注意:此外,如果“显示2012年计划”的按钮被多年的下拉列表替换,您能否建议一个可行的解决方案。

    基于MVC原则:The UI logic belongs in the view. Input logic belongs in the controller. Business logic belongs in the model.

    1. 我们如何快速实现?

    2. 我们如何达到标准方式(遵循上面列出的MVC原则)

    3. 获取图片

      enter image description here

      CODE

       namespace MyEventOriginIdentificationTest.Controllers
       {
      
       public class ProgramSchedule
       {
          public int ProgramID { get; set; }
          public string ProgramName { get; set; }
          public int ScheduledDate { get; set; }
          public int ScheduledMonth { get; set; }
          public int ScheduledYear { get; set; }
       }
      
      
      public class ProgramTetecastController : Controller
      {
      
          List<ProgramSchedule> wholeProgramList = new List<ProgramSchedule>()
                            {
                              new ProgramSchedule
                              {
                                  ProgramID = 1,ProgramName = "2012-March-15",
                                  ScheduledDate = 15,ScheduledMonth=3,ScheduledYear=2012
                              },
                              new ProgramSchedule
                              {
                                  ProgramID = 2,ProgramName = "2012-March-16",
                                  ScheduledDate = 16,ScheduledMonth=3,ScheduledYear=2012
                              },
                              new ProgramSchedule
                              {
                                  ProgramID = 3,ProgramName = "2012-April-11",
                                  ScheduledDate = 11,ScheduledMonth=4,ScheduledYear=2012
                              },
                              new ProgramSchedule
                              {
                                  ProgramID = 4,ProgramName = "2013-Jan-05",
                                  ScheduledDate = 5,ScheduledMonth=1,ScheduledYear=2013
                              }
      
                            };
      
      
      
      
          public List<ProgramSchedule> GetProgramsScheduleForMonth(int theMonth)
          {
      
              var monthProgram =
                                      from prog in wholeProgramList
                                      where prog.ScheduledMonth == theMonth
                                      select prog;
      
      
              return ((List<ProgramSchedule>)monthProgram);
      
          }
      
          public List<ProgramSchedule> GetProgramsScheduleForYear(int theYear)
          {
      
              var yearProgram =
                                      from prog in wholeProgramList
                                      where prog.ScheduledYear == theYear
                                      select prog;
      
      
              return ((List<ProgramSchedule>)yearProgram);
      
          }
      
      
      
          // GET: 
          public ActionResult MyProgramSchedule()
          {
              return View(wholeProgramList);
          } 
      
          // POST: 
          [HttpPost]
          public ActionResult MyProgramSchedule(FormCollection collection)
          {
              try
              {
                  return RedirectToAction("ProgramSchedule");
              }
              catch
              {
                  return View();
              }
          }
      
      
          }
      }
      

      查看

      @model IEnumerable<MyEventOriginIdentificationTest.Controllers.ProgramSchedule>
      
      @{
      ViewBag.Title = "MyProgramSchedule";
      }
      
      <h2>MyProgramSchedule</h2>
      
      
      <div>
      
      
      <div id="sub-left" style="width:50%">
      
      <input type="submit" value="Show March Programs" />
      <input type="submit" value="Show 2012 Programs" />
      <br />
      </div>
      
      <div id="sub-right" style="width:50%">
      
      <table>
      <tr>
          <th style="border:1px solid Teal; background-color:Gray">
              ProgramID
          </th>
          <th style="border:1px solid Teal; background-color:Gray">
              ProgramName
          </th>
          <th style="border:1px solid Teal; background-color:Gray">
              ScheduledDate
          </th>
          <th style="border:1px solid Teal; background-color:Gray">
              ScheduledMonth
          </th>
          <th style="border:1px solid Teal; background-color:Gray">
              ScheduledYear
          </th>
          <th></th>
      </tr>
      
      @foreach (var item in Model) {
      <tr>
          <td style="border:1px solid Teal">
              @Html.DisplayFor(modelItem => item.ProgramID)
          </td>
          <td style="border:1px solid Teal">
              @Html.DisplayFor(modelItem => item.ProgramName)
          </td>
          <td style="border:1px solid Teal">
              @Html.DisplayFor(modelItem => item.ScheduledDate)
          </td>
          <td style="border:1px solid Teal">
              @Html.DisplayFor(modelItem => item.ScheduledMonth)
          </td>
          <td style="border:1px solid Teal">
              @Html.DisplayFor(modelItem => item.ScheduledYear)
          </td>
      
      </tr>
      }
      
      </table>
      
      </div>
      
      
      
      </div>
      

      阅读

      1. Store Attributes from Button in a Hidden field

      2. ASP.NET MVC3 RAZOR: Retrieving Hidden field Attribute value in Controller (using ViewModel)

      3. Issue with multiple views on single view

      4. Hide or Disable MVC3 ActionLinks depending on cell value

      5. ASP.NET MVC ActionFilterAttribute inject value before model binding


1 个答案:

答案 0 :(得分:2)

首先我永远不会将2个方法分为月份和年份,因为如果您更改方法签名以包含fromto,它们将完全相同日期,例如。

考虑到这一点,您可以执行以下操作:

public ActionResult ShowProgramsBetweenDates(DateTime? from, DateTime? to)
{
    if(from.HasValue && to.HasValue) {
        return View(GetProgramsBetweenDates(from.Value, to.Value));
    }

    return View(wholeProgramList);
} 

public IEnumerable<ProgramSchedule> GetProgramsBetweenDates(DateTime from, DateTime to)
{
    return from prog in wholeProgramList
           where prog.ScheduledDate >= from && prog.ScheduledDate <= to
           select prog;
}

你的按钮就像是:

@using(Html.BeginForm("ShowProgramsBetweenDates", "ProgramTetecast"))
{
    <input type="button" value="Show March Programs" 
           data-from="01-03-2012" data-to="31-03-2012" />
    <input type="button" value="Show 2012 Programs" 
           data-from="01-01-2012" data-to="31-12-2012" />

    <input type="hidden" id="from" value="" />
    <input type="hidden" id="to" value="" />
}

和一个简单的JQuery来帮助

$('form input[type="button"]').on('click', function() { // for all buttons in the form

    $('#from').val($(this).attr('data-from')); // set #from with date-from
    $('#to').val($(this).attr('data-to')); // set #to with date-to

    $(this).closest('form').submit();  // submit the form

});

作为一项原则,并且为了在整个应用程序生命周期内提供帮助,您的日期永远不会有多个值,不需要来分割日期一个“表”,因为您可以从日期字段中提取所需的一切

例如,你的班级可以简单地作为

public class ProgramSchedule
{
  public ProgramSchedule() {} // Always add an empty constructor
  public int ProgramID { get; set; }
  public string ProgramName { get; set; }
  public int ScheduledDate { get; set; }
}

所以你的DataObject会是这样的:

List<ProgramSchedule> wholeProgramList = new List<ProgramSchedule>()
    {
        new ProgramSchedule
        {
            ProgramID = 1, ProgramName = "2012-March-15",
            ScheduledDate = new DateTime(2012, 3, 15)
        },
        new ProgramSchedule
        {
            ProgramID = 2, ProgramName = "2012-March-16",
            ScheduledDate = new DateTime(2012, 3, 16)
        },
        new ProgramSchedule
        {
            ProgramID = 3, ProgramName = "2012-March-11",
            ScheduledDate = new DateTime(2012, 3, 11)
        },
        new ProgramSchedule
        {
            ProgramID = 4, ProgramName = "2012-January-5",
            ScheduledDate = new DateTime(2012, 1, 5)
        },
    };

在您的视图中,您可以轻松完成:

@foreach (var item in Model) {
<tr>
    <td style="border:1px solid Teal">
        @Html.DisplayFor(modelItem => item.ProgramID)
    </td>
    <td style="border:1px solid Teal">
        @Html.DisplayFor(modelItem => item.ProgramName)
    </td>
    <td style="border:1px solid Teal">
        @Html.DisplayFor(modelItem => item.ScheduledDate)
    </td>
    <td style="border:1px solid Teal">
        @item.ScheduledDate.toString("MMM")
    </td>
    <td style="border:1px solid Teal">
        @item.ScheduledDate.ToString("yyyy")
    </td>
</tr>
}