【问题标题】:javascript ASP.NET hiddenfield get value from code behindjavascript ASP.NET hiddenfield 从后面的代码中获取价值
【发布时间】:2012-11-18 16:47:23
【问题描述】:

我正在尝试将我的代码集成到 Google Chart API。我想从后面的代码中手动设置谷歌图表标题和轴列名称。我尝试了下面的代码,但不起作用。有什么建议吗?

ASPX 文件

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
        google.load("visualization", "1", { "packages": ["corechart"] });
        function drawProgrammingChart() {
            var data = new google.visualization.DataTable(operationdetails, 0.5);
            var chart = new google.visualization.LineChart(document.getElementById("divprog"));
            **var xAxis = document.getElementById("txtXAxisName");**
            **console.log(xAxis);**
            var yAxis = document.getElementById("txtYAxisName");
            chart.draw(data, {
                title: "Visualization Satisfaction", hAxis: { title: "Programming method" }, vAxis: { title: "Units" }
            });
        }
        google.setOnLoadCallback(drawProgrammingChart);
    </script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <div id="divprog" style="width: 750px; height: 350px;">
        </div>
    <asp:HiddenField ID="txtXAxisName" runat="server" />
    <asp:HiddenField ID="txtYAxisName" runat="server" />
</asp:Content>

在后面的代码中我想手动设置隐藏字段值。

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                DataTable dt = generateDataTable();
                **txtXAxisName.Value = "Days";**
                txtYAxisName.Value = "Duration";
                LoadChart(dt, "operationdetails");    
            }

        }
private void LoadChart(DataTable table, string jsName)
        {
            Page.ClientScript.RegisterStartupScript(
                this.GetType(),
                jsName, string.Format("var {0} = {1};", jsName, new Bortosky.Google.Visualization.GoogleDataTable(table).GetJson()), true);
        }

获取元素txtAxisName时,它为null。

【问题讨论】:

    标签: c# javascript asp.net hiddenfield


    【解决方案1】:

    您可以尝试以下方法:

    var yAxis = document.getElementById('<%# txtYAxisName.ClientID %>');
    

    【讨论】:

    • 已尝试但 XAxis 仍为空。 var xAxis = document.getElementById(''); console.log("XAxis:"+xAxis);
    • 如果您查看呈现的页面源代码,您是否可以看到客户端 ID 被吐出?如果不是,你看到了什么?
    • 如果您使用此答案中的数据绑定语法 (
    【解决方案2】:

    首先要获得一个控件的渲染ID,你需要使用&lt;%=txtYAxisName.ClientID%&gt;,这在你的代码中将是:

    var xAxis = document.getElementById("<%=txtXAxisName.ClientID%>");
    

    但要真正获取它的值,您需要使用 .value 属性。

    var xAxis = document.getElementById("<%=txtXAxisName.ClientID%>").value;
    

    但如果你实际上不需要更改,也可以在回发这个隐藏字段时使用,你可以直接将代码写成:

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load("visualization", "1", { "packages": ["corechart"] });
            function drawProgrammingChart() {
                var data = new google.visualization.DataTable(operationdetails, 0.5);
                var chart = new google.visualization.LineChart(document.getElementById("divprog"));
                var xAxis = <asp:Literal runat="server" id="txtXAxisName" EnableViewState="False" />
                var yAxis = <asp:Literal runat="server" id="txtYAxisName" EnableViewState="False" />
                chart.draw(data, {
                    title: "Visualization Satisfaction", hAxis: { title: "Programming method" }, vAxis: { title: "Units" }
                });
            }
            google.setOnLoadCallback(drawProgrammingChart);
        </script>
    </asp:Content>
    

    以及后面的代码

    txtXAxisName.Text = "\"Days\";";
    txtYAxisName.Text = "\"Duration\";";
    

    并在脚本内直接在页面上呈现值。

    【讨论】:

      【解决方案3】:
      var yAxis = document.getElementById('<%# txtYAxisName.ClientID %>');
      

      【讨论】:

      • 稍微解释一下就好了!
      【解决方案4】:

      正如 Cal279 所示,我查看了渲染页面的源代码,如下所示:

      <input type="hidden" name="ctl00$MainContent$txtXAxisName" id="MainContent_txtXAxisName" value="Days" />
      

      然后我在下面尝试并成功了。感谢 Cal279 :)

      var xAxis = document.getElementById("MainContent_txtXAxisName");
      

      【讨论】:

        猜你喜欢
        • 2015-02-09
        • 2012-10-26
        • 1970-01-01
        • 1970-01-01
        • 2012-11-16
        • 1970-01-01
        • 2016-05-21
        • 1970-01-01
        • 2016-01-01
        相关资源
        最近更新 更多