堆栈内存溢出
  繁体   English   中英

在Javascript document.getElementById（'name'）上获取错误。 RETURNS NULL

[英]Getting Error On Javascript document.getElementById('name'). RETURNS NULL

 原文  2012-08-04 17:56:46  1   2    c#/ javascript/ asp.net

问题描述

我需要在ASP.NET上执行一个javascript函数，但是我遇到了一个我似乎无法解决的错误...

我已经尝试了一个有效的小例子......这里是......

Aspx文件 

<title>Untitled Page</title>
<script type="text/javascript" language="javascript">
    function ExecuteConfirm() {
    debugger
        var returnValue = confirm('Do you want to proceed further?');
        if (returnValue) {
            document.getElementById('hdnExecuteAfterConfirm').value = "1";
            document.getElementById('btnClickMe').click();
        }


    }
</script>


<body>
<form id="form1" runat="server">
<asp:Label runat="server" ID="lblMessage">
</asp:Label>

<div>
    <asp:Button ID="btnClickMe" runat="server" Text="Click me" 
        onclick="btnClickMe_Click" />
</div>
<asp:HiddenField runat="server" ID="hdnExecuteAfterConfirm" />
</form>
</body>

CS档案 

protected void btnClickMe_Click(object sender, EventArgs e)
    {
        //Do server side processing before confirmation
        if (hdnExecuteAfterConfirm.Value != "1")
        {
            lblMessage.Text = "You clicked the button";
            ClientScript.RegisterStartupScript(this.Page.GetType(), btnClickMe.ID, "ExecuteConfirm()", true);

        }
        //Do server side processing after confirmation
        else
        {
            //Proceed further with server side processing

            //Reset the value of hidden field
            hdnExecuteAfterConfirm.Value = "";
            //Notify the user that processing is complete.
            ClientScript.RegisterStartupScript(this.Page.GetType(), btnClickMe.ID, "alert('Processing is complete.')", true);
        }
    }

这里的目标是在您第一次单击按钮（如果）时显示确认消息，并且一旦您在确认消息上单击是，它将重复按钮功能，但是，它将执行不同的操作（否则）...

我正在尝试在我的项目中重新创建此功能，但我遇到了错误...

这是我的...

请注意，我不是在复制我的整个项目，这些只是我必须改变的部分......

的Site.Master 

<script type="text/javascript" language="javascript">
        function ConfirmarRegistroFecha(strAdvertencia) {
            debugger
            var returnValue = strAdvertencia;

            if (returnValue) {
                try{
                document.getElementById('hdnExecuteAfterConfirm').value = "1";  
                document.getElementById('btnGuardarEvento').click();
                }

                catch(error){
                    alert(error);
                }
            }
        }
    </script>

Agenda.aspx（我知道这很多，但是，我正在复制它，因为可能错误就在这里某处。重点是至少，内部是一个HiddenField和一个按钮） 

<asp:View ID="ViewOperacionesAgenda2" runat="server">
            <asp:HiddenField runat="server" ID="hdnExecuteAfterConfirm" />
            <br />

            <asp:Panel ID="pnlRegistrarEvento" runat="server" DefaultButton="btnGuardarEvento">
                <table>
                    <tr>
                        <td align="left">
                            Seleccione Vendedor:
                            <br />

                            <asp:DropDownList ID="dpdLstVendedoresAgenda" runat="server" Width="150px">
                            </asp:DropDownList>
                        </td>

                        <td align="left" rowspan="3">
                            Descripcion:
                            <br />

                            <asp:TextBox ID="tbxAlAgendaDescripcion" runat="server" Height="150px" TextMode="MultiLine" ValidationGroup="gpAgendaAlta" Width="150px">
                            </asp:TextBox>
                        </td>

                        <td align="left" rowspan="3">
                            Fecha:
                            <br />

                            <asp:Calendar ID="Calendar1" runat="server" BackColor="White" 
                                BorderColor="#3366CC" BorderWidth="1px" CellPadding="1" 
                                DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="7pt" 
                                ForeColor="#003399" Height="150px" Width="150px">
                                <DayHeaderStyle BackColor="#99CCCC" ForeColor="#336666" Height="1px" />
                                <NextPrevStyle Font-Size="8pt" ForeColor="#CCCCFF" />
                                <OtherMonthDayStyle ForeColor="#999999" />
                                <SelectedDayStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
                                <SelectorStyle BackColor="#99CCCC" ForeColor="#336666" />
                                <TitleStyle BackColor="#003399" BorderColor="#3366CC" BorderWidth="1px" Font-Bold="True" Font-Size="10pt" ForeColor="#CCCCFF" Height="25px" />
                                <TodayDayStyle BackColor="#99CCCC" ForeColor="White" />
                                <WeekendDayStyle BackColor="#CCCCFF" />
                            </asp:Calendar>
                        </td>

                        <td rowspan="3">
                            <table>
                                <tr>
                                    <td align="left">
                                        Hora Inicio:
                                        <br />

                                        <asp:TextBox ID="tbxAlAgendaHoraInicio" runat="server" ValidationGroup="gpAgendaAlta" Width="130px">0:00 am</asp:TextBox>

                                        <br />

                                        <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" 
                                            ControlToValidate="tbxAlAgendaHoraInicio" 
                                            ErrorMessage="Hora Invalida: use 00:00 pm" 
                                            ValidationExpression="^((0?[1-9]|1[012])(:[0-5]\d)((\ )?[ap](.)?m(.)?))" 
                                            ValidationGroup="vgpRegistrarEvento" Font-Bold="True" ForeColor="Red">
                                        </asp:RegularExpressionValidator>

                                        <br />

                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" 
                                            ControlToValidate="tbxAlAgendaHoraInicio" ErrorMessage="Campo Requerido" 
                                            ValidationGroup="vgpRegistrarEvento" Font-Bold="True" ForeColor="Red">
                                        </asp:RequiredFieldValidator>
                                    </td>
                                </tr>

                                <tr>
                                    <td align="left">
                                        Hora Final:
                                        <br/>

                                        <asp:TextBox ID="tbxAlAgendaHoraFinal" runat="server" ValidationGroup="gpAgendaAlta" Width="130px">0:00 am</asp:TextBox>

                                        <br />

                                        <asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" 
                                            ControlToValidate="tbxAlAgendaHoraFinal" 
                                            ErrorMessage="Hora Invalida: use 00:00 pm" 
                                            ValidationExpression="^((0?[1-9]|1[012])(:[0-5]\d)((\ )?[ap](.)?m(.)?))" 
                                            ValidationGroup="vgpRegistrarEvento" Font-Bold="True" ForeColor="Red">
                                        </asp:RegularExpressionValidator>

                                        <br />

                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server" 
                                            ControlToValidate="tbxAlAgendaHoraFinal" ErrorMessage="Campo Requerido" 
                                            ValidationGroup="vgpRegistrarEvento" Font-Bold="True" ForeColor="Red">
                                        </asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>

                    <tr>
                        <td align="left">
                            Seleccione Cliente:
                            <br />

                            <asp:DropDownList ID="dpdLstClientesAgenda" runat="server" AutoPostBack="True" onselectedindexchanged="dpdLstClientesAgenda_SelectedIndexChanged" Width="150px">
                            </asp:DropDownList>
                        </td>
                    </tr>

                    <tr>
                        <td align="left">
                            Tipo:
                            <br />

                            <asp:DropDownList ID="dpdLstAlAgendaTipo" runat="server" Width="150px">
                                <asp:ListItem>Reunion</asp:ListItem>
                                <asp:ListItem>Entrevista</asp:ListItem>
                                <asp:ListItem>Venta</asp:ListItem>
                                <asp:ListItem>Soporte</asp:ListItem>
                                <asp:ListItem>Instalacion</asp:ListItem>
                            </asp:DropDownList>
                        </td>
                    </tr>
                </table>

                <br />
                <asp:Button ID="btnCancelarEvento" runat="server" CausesValidation="False" onclick="btnCancelarEvento_Click" Text="Cancelar" Width="90px" />
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <asp:Button ID="btnGuardarEvento" runat="server" onclick="btnGuardarEvento_Click" Text="Guardar" ValidationGroup="vgpRegistrarEvento" Width="90px" />
            </asp:Panel>

Agenda.aspx.cs 

protected void btnGuardarEvento_Click(object sender, EventArgs e)
    {

            if (hdnExecuteAfterConfirm.Value != "1")
            {
                strAdvertencia = "MESSAGE I WANT TO DISPLAY";
                ClientScript.RegisterStartupScript(this.Page.GetType(), btnGuardarEvento.ID, "ConfirmarRegistroFecha(" + strAdvertencia + ")", true);

            }

            else
            {
                hdnExecuteAfterConfirm.Value = "";
                //Rest of process
            }
    }

使用带有Firebug的调试器，我可以在Site.Master上清楚地看到它到达时.. 

document.getElementById('hdnExecuteAfterConfirm').value = "1";

它显示以下异常： 

TypeError: document.getElementById("hdnExecuteAfterConfirm") is null

我已经尝试在Agenda.aspx而不是Site.Master上复制javascript ...但它仍然无效...

有谁知道这里的错误是什么...我是javascript的新手，所以我仍然认为这是一个语法错误...

在此先感谢，我希望你能帮助我

2 个解决方案

解决方案1
 1  2012-08-04 18:19:26

问题是因为控件嵌入在容器控件中，所以在客户端中修改了其ID。

我不确定Firefox中的等价物是什么，但在Internet Explorer（至少是v9）中，您可以按F12打开开发人员工具并浏览DOM结构以找出实际名称。

有多种方法可以解决这个问题，包括对完整ID进行硬编码，这是一个脆弱的解决方案，或者更新web.config以使用提供的ID，这可能会导致冲突的ID。

我们解决这个问题的方法是使用客户端ID在代码后面创建一个javascript变量。 这样，如果控件移动到不同的容器控件或重命名，则不必调整代码来解决此问题。

为此，我们使用Page.ClientScript.PageClient.RegisterStartupScript。 例如： 

this.ClientScript.RegisterStartupScript(this.GetType(), "LocalVars", "var m_hdnExecuteAfterConfirmId = '" + hdnExecuteAfterConfirm.ClientID + "';" + Environment.NewLine, true);

然后将javascript更改为： 

document.getElementById('m_hdnExecuteAfterConfirmId').value = "1";

解决方案2
 1 已采纳  2012-08-04 19:24:05

使用此脚本： 

document.getElementById('<%= hdnExecuteAfterConfirm.ClientID %>').value = "1";  
document.getElementById('<%= btnGuardarEvento.ClientID %>').click();

当您使用母版页时， hdnExecuteAfterConfirm客户端ID与服务器ID不同。

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 动态生成的html，document.getElementByID返回null 在C＃已经分配了document.getElementById（&#39;textbox&#39;）后，为什么在javascript中为null？ blazor 中的 document.getElementById() 在document.getElementByID上出现JavaScript错误“对象不支持此属性或方法”？ C＃ASP.NET document.getElementById没有得到重视 document.getelementbyid在循环/ if中不起作用 Document.getElementById（）不适用于Visual Studio中的ChromiumWebBrowser document.getElementById（&#39;TextBox1&#39;）。value不起作用 从C＃中的背后代码调用javascript函数时，document.getElementById（）无法正常工作 document.getElementById（'id'）。值在ASP.net javascript函数中失败
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM