Grid选中行日期字段无法赋值给Form的IskurDateBox控件问题

问题分析 #

直接通过document.getElementById('dtCikisTarih').value赋值无效，核心原因是IskurDateBox是自定义服务器控件，渲染后并非原生input元素，它内部通常封装了原生输入框、日历弹窗等组件，直接操作外层容器的value属性不会起作用。

解决方案 #

1. 定位控件内部的原生输入框

打开浏览器开发者工具（F12），找到dtCikisTarih对应的DOM结构，通常会看到类似嵌套结构：

<div id="dtCikisTarih" class="iskur-datebox">
  <input type="text" id="dtCikisTarih_Input" class="iskur-date-input" />
  <!-- 日历控件相关元素 -->
</div>

修改脚本，直接给内部的原生input赋值：

function callme(e) {
    var tds = e.parentNode.parentNode.getElementsByTagName('td');
    document.getElementById('txtFirmaAdi').value = tds[2].innerHTML.trim();
    
    // 替换为实际渲染出的内部input的ID
    document.getElementById('dtCikisTarih_Input').value = tds[7].innerHTML.trim();
}

2. 使用控件提供的客户端API（推荐）

多数自定义ASP.NET控件会暴露客户端操作方法，比如设置日期的setDate或setValue，查看Iskur控件文档找到对应API后，可这样修改：

function callme(e) {
    var tds = e.parentNode.parentNode.getElementsByTagName('td');
    document.getElementById('txtFirmaAdi').value = tds[2].innerHTML.trim();
    
    // 假设控件提供了getInstance和setDate方法
    var dateControl = IskurDateBox.getInstance('dtCikisTarih');
    dateControl.setDate(tds[7].innerHTML.trim());
}

3. 验证并匹配日期格式

如果控件要求特定日期格式（如dd/MM/yyyy），而Grid中BITISTARIHI的格式是dd.MM.yyyy，需要先转换格式：

function callme(e) {
    var tds = e.parentNode.parentNode.getElementsByTagName('td');
    document.getElementById('txtFirmaAdi').value = tds[2].innerHTML.trim();
    
    var rawDate = tds[7].innerHTML.trim();
    // 将点分隔的日期转换为斜杠分隔（根据控件要求调整格式）
    var formattedDate = rawDate.replace(/\./g, '/');
    document.getElementById('dtCikisTarih_Input').value = formattedDate;
}

4. 确认列索引正确性

可通过控制台验证tds[7]的取值是否正确：

function callme(e) {
    var tds = e.parentNode.parentNode.getElementsByTagName('td');
    console.log(tds[7].innerHTML.trim()); // 查看控制台输出的日期值是否符合预期
    // ...其他赋值代码
}

内容的提问来源于stack exchange，提问作者Haluk Öztürk