How can I get the latest value of td Input box without press tab key

Question

User-1355965324 posted

Here I am trying to get the latest value of Input in a td column of the table. Now I am getting the latest value only after press tab key

<table>
    <tr>
	<td class="holidaycheck"><input type="checkbox" value="true" asp-for="@Model.attendanceLogList[i].IsHolidayMarked" data-tag="HolidayHrs" /><input type="hidden" value="false" asp-for="@Model.attendanceLogList[i].IsHolidayMarked" /> </td>
           <td class="holidayHrs"><a href="#" data-pk="HolidayHrs">@Model.attendanceLogList[i].HolidayHrs</a><input  asp-for="@Model.attendanceLogList[i].HolidayHrs" name="HolidayHrs"   id="myHoliday"  type="hidden" class="bros"/></td>
    </tr>

</table>

<script>
$(document).ready(function () {

   $("input:checkbox").on('click', function () {
        var $box = $(this);
	
         if ($box.is(":checked")) {
            netHrs = parseFloat(netHrs);
            $box.parent('td').parent('tr').find(".bros").each(function () {
               // Here I gets the value from the class 'bros'  only if I Press Tab Key. How can I  get the value 
               //without tab or trigger tab inside
                if (parseFloat($(this).val()) > 0.00) {
                    var intime = parseFloat(netHrs).toFixed(2);
                    var outtime = parseFloat($(this).val()).toFixed(2);
                    netHrs = GetNetHrs(intime, outtime);
                }
            });
	})
})
</script>

Answer 1

User-474980206 posted

What UI event is supposed to trigger this logic?

Answer 2

User-1355965324 posted

asp.net core html table  and trying to get the latest value from the input element when I click   the checkbox  which  just before the input element.

Answer 3

User1686398519 posted

Hi polachan, 

How can I  get the value without tab or trigger tab inside

I tested the code you provided, and you can get the value of HolidayHrs by just using $(this).val().

I did not reproduce your problem. If you can, can you provide more code?

Below is the code I tested:

<table class="table">
    <tr>
        <td class="holidaycheck">IsHolidayMarked</td>
        <td class="holidayHrs">HolidayHrs</td>
    </tr>
    @for (int i = 0; i < Model.attendanceLogList.Count(); i++)
    {

        <tr>
            <td class="holidaycheck"><input type="checkbox" value="true" asp-for="@Model.attendanceLogList[i].IsHolidayMarked" data-tag="HolidayHrs" /><input type="hidden" value="false" asp-for="@Model.attendanceLogList[i].IsHolidayMarked" /> </td>
            <td class="holidayHrs"><a href="#" data-pk="HolidayHrs">@Model.attendanceLogList[i].HolidayHrs</a><input asp-for="@Model.attendanceLogList[i].HolidayHrs" name="HolidayHrs" id="myHoliday" type="hidden" class="bros" /></td>
        </tr>
    }

</table>
@section scripts{ 
<script>
    $(document).ready(function () {
        $("input:checkbox").on('click', function () {
            var $box = $(this);
            if ($box.is(":checked")) {
                $box.parent('td').parent('tr').find(".bros").each(function () {
                    if (parseFloat($(this).val()) > 0.00) {
                       console.log($(this).val())
                    }
                });
            }
         });
    })
</script>
}

Best Regards,

YihuiSun