Question

我很难弄清楚如何使用jQuery从C＃调用变量。我似乎无法访问变量sqlReq。我的最终目标是能够将自己的SQL信息添加到此PieChart中。但我真的不知道如何在HTML或jQuery中调用和设置C＃SQL请求......

我看了很多例子，但我似乎无法得到具体答案。我不确定它是否与没有引用C＃类或什么。

有关

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Diagnostics;

namespace KendoUIApp3.Controllers
{
    public class HomeController : Controller
    {
        public String sqlReq = "";
        public ActionResult Index()
        {
            ViewBag.Message = "Welcome to ASP.NET MVC!";

            SqlConnection sqlConn = new SqlConnection("someDB");
            SqlCommand cmd = new SqlCommand();
            cmd.Connection = sqlConn;
            SqlDataReader read;
            cmd.CommandText = "SELECT COUNT(*) FROM P";
            cmd.CommandType = CommandType.Text;
            sqlConn.Open();

            read = cmd.ExecuteReader();
            sqlReq = read.ToString();
            sqlConn.Close();
            Console.Write(read);
            return View();
        }

        public ActionResult About()
        {
            ViewBag.Message = "Your app description page.";

            return View();
        }

        public ActionResult Contact()
        {
            ViewBag.Message = "Your contact page.";

            return View();
        }
    }
}


@{
    ViewBag.Title = "Home Page";
}

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="styles/kendo.common.min.css" />
    <link rel="stylesheet" href="styles/kendo.default.min.css" />
    <link rel="stylesheet" href="styles/kendo.default.mobile.min.css" />

    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.all.min.js"></script>
    <script src="C:\Users\215000712\source\repos\KendoUIApp3\KendoUIApp3\Scripts\kendo\sqlQuery.js"></script>
</head>
<body>
    <div id="example">
        <div class="demo-section k-content wide">
            <div id="chart" style="background: center no-repeat url('../content/shared/styles/world-map.png');"></div>
        </div>
        <script>
            function createChart() {
                $("#chart").kendoChart({
                    title: {
                        position: "bottom",
                        text: "Share of Internet Population Growth, 2007 - 2012"

                    },
                    legend: {
                        visible: false
                    },
                    chartArea: {
                        background: ""
                    },
                    seriesDefaults: {
                        labels: {
                            visible: true,
                            background: "transparent",
                            template: "#= category #: \n #= value#%"
                        }
                    },
                    series: [{
                        type: "pie",
                        startAngle: 150,
                        data: [{
                            category: "Asia",
                            value: 53.8,
                            color: "#9de219"
                        }, {
                            category: "Europe",
                            value: 16.1,
                            color: "#90cc38"
                        }, {
                            category: "Latin America",
                            value: 11.3,
                            color: "#068c35"
                        }, {
                            category: "Africa",
                            value: 9.6,
                            color: "#006634"
                        }, {
                            category: "Middle East",
                            value: 5.2,
                            color: "#004d38"
                        }, {
                            category: "North America",
                            value: 3.6,
                            color: "#033939"
                        }]
                    }],
                    tooltip: {
                        visible: true,
                        format: "{0}%"
                    }
                });
            }

            $(document).ready(createChart);
            $(document).bind("kendo:skinChange", createChart);
        </script>

    <div>
        <br/>
        <br/>
        <br />
    <script type="text/javascript">
            $(document).ready(function ()
            {
                alert("@sqlReq")
            })
    </script>
    </div>
</body>
</html>

Answer 1

您的控制器将值传递给HTML，如果您希望数据从您的页面移动到C＃控制器（例如使用Ajax），则需要回发。

好消息是，这是一种向HTML发送值的简单方法。例如，在控制器中，创建一个字符串列表，并将它们添加到视图中：

public ActionResult Index()
    {
        return View(new List<string> {"A", "B"});
    }

然后，在您的视图中，请参阅页面顶部的此模型：

@model IEnumerable<string>

您现在可以获取这些引用并将其显示在表格中：

<table class="table table-striped table-bordered table-hover">
@foreach (var entry in Model)
{
    <tr><td>@Html.DisplayFor(modelName => entry)</td></tr>
}

我在此示例中使用的模型只是一个字符串列表，但您的模型可能是您在C＃中制作的任何模型。

在您的示例中，这可能是您的SQL读取结果 - 很难说不知道您的数据是什么样的，但您可以在视图中使用@model string，这在您的控制器中：< / p>

return View(sqlReq.ToString())

将C＃变量传递给html

1 个答案: