如何使用jQuery在同一行中的另一个输入ID选择第n个输入文本框?

时间:2019-07-11 14:19:52

标签: javascript jquery html

我有一个由代码隐藏生成的行,并且每一行都包含包含输入文本框的tds。我需要文本出现在从原始输入(id = Date)向下选择2 tsd的文本框中,但是基于同一行中的所选文本框,它是输入的ID。问题是,尽管我确保它们确实具有单独的ID,但是有多个行需要执行此操作。因此,实际上我需要输入的ID,根据该行中选择的“日期”输入,文本将在其中显示。本质上,日期需要在关联的“日期”输入框中显示为一天。任何帮助表示赞赏!

我尝试了以下方法:

var DayId = $("#" + id).closest('input').attr('id');

var DayId = $("#" + id).closest('tr').find('td:eq(2)').attr('id');

第一个似乎有效,但是仅获取所选框的ID,而不获取具有DayId与该行中所选输入相关联的输入。我认为第二行距离更近,但返回未定义。

日期转换工作正常,但让它与“日期”输入中的“日期”一起显示时仍未解决。

<script>
    $('body').on('focus', ".datepickerInput", function () {
        $(this).datepicker({
            controlType: "select",
            onSelect: showDay($(this).attr("id"))
        });
    });

    function showDay(id) {
        var DayId = $("#" + id).closest('tr').find('td:eq(2)').attr('id')
         alert(DayId)

        var weekday = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
        var dateVal = "";
        dateVal = $("#" + id).val();
        var x = new Date(dateVal);
        dayOfWeek = weekday[x.getDay()];
        ("#" + DayId).val(dayOfWeek)
    }

    showDay()
</script>

<table>
 <thead>
  <tr>
   <th>infoA</th>
   <th>infoB</th>
   <th>infoC</th>
   <th>infoD</th>
  </tr>
 <thead>
 <tbody>
  <tr>
   <td>
   <input type="text asp-for="Shift0">
   </td>
   <td>
   <input type="text" asp-for="Date0" class="datepickerInput"/>
   </td>
   <td>
   <input type="text" asp-for="Time0" class="timepickerInput" />
   </td>
   <td>
   <input type="text" asp-for="Day0" />
   </td>
  </tr>
  <td>
   <input type="text asp-for="Shift1">
   </td>
   <td>
   <input type="text" asp-for="Date1" class="datepickerInput"/>
   </td>
   <td>
   <input type="text" asp-for="Time1" class="timepickerInput" />
   </td>
   <td>
   <input type="text" asp-for="Day1" />
   </td>
  <tr>
   @*..More of the same tds with different ids.*@
  </tr>
 </body>

我需要根据同一行中的日期ID来确定日期。

1 个答案:

答案 0 :(得分:0)

您的两次尝试均无效,因为:

1)closest('input')寻找祖先或自我。由于<input>没有子代,因此永远不能成为祖先

2)find('td:eq(2)').attr('id')正在寻找<td>而非<input>上的ID

尝试

var DayId = $("#" + id).closest('tr').find('td:eq(2) input').attr('id');
                                                  // ^^^^^