Question

在我的gridview我有一个日期列并处于编辑模式，我在那里放置了一个日期选择器。日期选择器在javascript中，使用getElementById()来获取/设置文本框上的值。

这是gridview的代码，如果处于编辑模式，则带有日期选择器：

<asp:TemplateField HeaderText="Effective Date" HeaderStyle-CssClass="allWidth160" ItemStyle-HorizontalAlign="Center" ControlStyle-CssClass="txtCommon allWidth80 txtCenter">
     <ItemTemplate>
          <asp:Label runat="server" ID="lblEffDate"  Text='<%#DataBinder.Eval(Container.DataItem, "EFF_DATE").ToString()%>'>
          </asp:Label>
     </ItemTemplate>
     <EditItemTemplate>
          <asp:TextBox ClientIDMode="Static" ID="EffDate" runat="server" Text='<%#Bind("EFF_DATE") %>' />
          <img alt="Calendar" src="../Images/DateTimePickerImg/cal.gif" style="cursor: pointer;" onclick="javascript: NewCssCal('txtEffDate')" />
     </EditItemTemplate>
</asp:TemplateField>

我在HEAD中包含了javascript文件：

<script src="../Library/DateTimePicker.js" type="text/javascript"></script>

当我点击图片日历时，它在DateTimePicker.js文件中的某处出现错误，导致此代码：

exDateTime = document.getElementById(pCtrl).value;

其中pCtrl是txtEffDate。

错误：需要对象

它似乎无法看到对象txtEffDate这就是为什么它会抛出该错误。我认为当它处于编辑模式时，它只在浏览器中显示其绘图（文本框出现），但其ID仍然缺失。有什么想法吗？ TIA

Answer 1

创建一个新函数并通过它。就像这样。

 onclick = "javascript: NewCssCalClick(this)"

在js中创建一个新函数NewCssCalClick.Like this。

function NewCssCalClick(sender) {

    var id = $(sender).prev()[0].id;
    NewCssCal(id);
}

注意：您需要为$和prev添加jquery插件

Answer 2

如果您使用的是jQuery，可以使用

 $("[id*='EffDate']")

 exDateTime = $("[id*='EffDate']").val();

获取文本框。因为您一次只能有一个文本框。因为您可能一次只能编辑一行。

Answer 3

修改编辑项目模板，如下所示：

将id =“imgCalander”runat =“server”属性添加到calander图像和onclick属性，如onclick =“fnShowCalander（this.id）;”

在javascript中定义如下的新功能：

    function fnShowCalander(senderID) {
        NewCssCal(senderID.replace('imgCalander', 'EffDate'));
    }

</script>

网格视图中的编辑模式无法使用getElementById（）查找文本框ID

3 个答案: