簡體   English   中英

MVC:在視圖中使用控制器數據

[英]MVC: using controller data in view

我要顯示其在一個特定的時間范圍根據用戶輸入發現數據startdateenddate通過使用MVC圖表英寸 為此,我需要json數據。 我可以根據用戶輸入獲取json數據,但無法看到圖表,因為我無法使用url:Machines/Parameter

index.cshtml

<body>

 @using (Html.BeginForm("Parameter", "Machines", FormMethod.Post))
{
<div>

   Start Date:  <input type="datetime" id="start" name="start" />

   End Date: <input type="datetime" id="end" name="end" />

</div>
 <input type="submit" value="OK" /> 
Html.EndForm();}

MachinesController.cs

public ActionResult Index()
{
    return View();

}


public ActionResult Parameter(DateTime start, DateTime end)
{
    MachinesSql a = new MachinesSql();

    var data = Json(a.SqlAccessParameter(start, end), JsonRequestBehavior.AllowGet);

    return View(data);

}

型號:Machines.cs

namespace DenemeReport.Models
{


public class Machines
{
    [Key]
    public int AutoKey;
    public string MachineGroup;
    public DateTime StartDate;
    public DateTime EndDate;
    public int Duration;

}
public class MachinesDBContext : DbContext
{
    public DbSet<Machines> Machine { get; set; }

}

 public List<Machines> SqlAccessParameter(DateTime startDate, DateTime endDate)
 {

    SqlConnection myConnection = new SqlConnection(connstr);
    myConnection.Open();
    SqlCommand myCommand = new SqlCommand("DateRange",myConnection);
    myCommand.CommandType = CommandType.StoredProcedure;
    myCommand.Parameters.Add("@SP_startDate", SqlDbType.DateTime).Value =startDate;
    myCommand.Parameters.Add("@SP_endDate", SqlDbType.DateTime).Value = endDate;

    SqlDataAdapter dataAdapter = new SqlDataAdapter();
    myCommand.ExecuteNonQuery();
    dataAdapter.SelectCommand = myCommand;

    DataSet dSet = new DataSet();
    dataAdapter.Fill(dSet);

    myConnection.Close();

    List<Machines> machinePost = new List<Machines>();
    foreach (DataRow row in dSet.Tables[0].Rows)
    {
        Machines mac = new Machines();
        mac.AutoKey = (int)row["AUTOKEY"];
        mac.MachineGroup = (string)row["MACHINEGROUP"];
        mac.Duration = (int)row["DURATION"];
        mac.StartDate = (DateTime)row["STARTTIME"];
        mac.EndDate = (DateTime)row["ENDTIME"];
        machinePost.Add(mac);
    }
    return machinePost;
}

Parameter.cshtml(包含圖表信息的“參數操作”視圖)

<title>Intro</title>

<script src="~/Scripts/jquery-1.8.3.min.js"></script>
<script src="~/Scripts/kendo/kendo.all.min.js"></script>
<link href="~/Scripts/kendo/kendo.common.min.css" rel="stylesheet" />
<link href="~/Scripts/kendo/kendo.default.min.css" rel="stylesheet" />

</head>

<div id="chart"></div>
<div id="chart2"></div>
<body>

 <script>

$("#chart").kendoChart
    ({
        theme: $(document).data("kendoSkin") || "default",
        title: {
            text: "Pie Chart Test"
        },
        legend: {
            position: "bottom",
        },

        dataSource:
            {

                transport:
                    {
                        read:
                             {
                                url: "Machines/Parameter", // This part create the problem I think. The url does not work.
                                    dataType: "json",
                                    contentType: 'application/json; charset=utf-8'
                                }


                    }
            },

        seriesDefaults: {
            labels: {
                visible: true,
                format: "{0}"
            }
        },

        series: [{

            type: "pie",
            field: "Duration",
            categoryField: "MachineGroup"
        }],

        tooltip: {
            visible: true,
            format: "{0}"
        }
    });
</script>
</body>

假設您使用的是Razor語法,請將"Machines/Parameter"替換為"@Url.Action("Parameter", "Machines")"

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM