-1

I am trying to get the current column value in keypress event given in javascript. Here is the code

 $(document).ready(function () {
  $("td").keypress(function (e) {
            var tr = $(this).parents('tr');
            var rownumber = tr.index();
            var colname = $(this).attr("class");            
        });
        
        if(colname == 'HolidayHrs')
        {
          var holidayhrs = the column value of the current row
        }
 })
 
 
<table>
  <tr>
    <td class="HolidayHrs"><a href="#" data-pk="HolidayHrs">@Model.attendanceLogList[i].HolidayHrs</a><input  asp-for="@Model.attendanceLogList[i].HolidayHrs" type="hidden" class="bros"/></td></td>
  </tr>
</table>
polachan paily
  • 69
  • 6
  • 2
    Please go through https://stackoverflow.com/questions/53994730/how-to-add-keypress-event-to-table-td. `td` doesn't have a keypress event. It's not an input field. – Kiran Feb 15 '21 at 17:44
  • I am getting keypress event there . If I print the console.log("KeyPress") inside the keypress function ,I would get that message. So I am hoping somehow we can get that current column value from the code – polachan paily Feb 15 '21 at 21:51

1 Answers1

0

If you want to get html code of td,you can use:

var holidayhrs=$(this).html();

If you only want to get the text of <a> link,you can use:

var holidayhrs = $(this).find("a:eq(0)").text();

Here is a demo：

html:

 <table>
        <tr>
            <td class="HolidayHrs"><a href="#" data-pk="HolidayHrs">HolidayHrs</a><input name="HolidayHrs"  class="bros" /></td>
        </tr>
    </table>

js(put if into function of keypress):

$(document).ready(function () {
        $("td").keypress(function (e) {
            var tr = $(this).parents('tr');
            var rownumber = tr.index();
            var colname = $(this).attr("class");
            if (colname == 'HolidayHrs') {
                var holidayhrs1 = $(this).html();

                var holidayhrs = $(this).find("a:eq(0)").text();

            }
        });

        
    })

result: enter image description here

Update:

If you want to get the newest data of input,you can try to use onchange event.Here is a demo:

html:

<table>
    <tr>
        <td class="HolidayHrs"><a href="#" data-pk="HolidayHrs">HolidayHrs</a><input name="HolidayHrs" class="bros" /></td>
    </tr>
</table>

js:

$("td input").change(function () {
            var tr = $(this).parent('td').parent('tr');
            var rownumber = tr.index();
            var colname = $(this).parent('td').attr("class");
            if (colname == 'HolidayHrs') {
                var holidayhrs = $(this).val();


            }
        });

result: enter image description here

Yiyi You
  • 16,875
  • 1
  • 10
  • 22
  • Many thanks for the reply. But When I have used the above code the new value of the holidayhrs is not being showed . for example initially the value of the column was 0 then I have changed into 10. But the holidayhrs variable being showed as 0 . Then I changed into 20, after that the variable being showed as 10. Is there anyway can I trigger the latest value either in keypress event or in out of focus from that column to any where , Please can you advise me – polachan paily Feb 16 '21 at 07:26
  • if I use var holidayhrs = $(this).html(); The html definition being showed with the column old value. How can I trigger the latest value of the column somehow either from keypress event of the column or when we move out of the focus from that column to anywhere – polachan paily Feb 16 '21 at 07:33
  • So you mean you change the value of the input,and you want to get the new value of input. – Yiyi You Feb 16 '21 at 07:39
  • exactly, I am looking for the new value somehow from that column either from keypress else the pointer after moving out of that column. – polachan paily Feb 16 '21 at 07:49
  • What new value you mean?I can only see a input in the td.And you can change its value.Can you give an example what you do to change values? – Yiyi You Feb 16 '21 at 07:58
  • For example on the input if the old value is 5, Then I changed 6.30. Once I change the existing value. The holidayhrs variable must be stored with 6.30. At the moment is given with 5. if I change it gain into 7.00, then the variable is given 5. The newly edited value is not given.Always the variable being showed with just previous value. – polachan paily Feb 16 '21 at 09:37
  • Somewhere I read the keyup event will help to get the latest value rather than using Keypress. . Is that true. if so please can you help ? – polachan paily Feb 16 '21 at 09:56
  • I have updated my answer,you can refer to it. – Yiyi You Feb 17 '21 at 02:14
  • Many Thanks Yiyi You . But my input type is hidden. I have given in my original post. So the change function is not being called while changing the holiday hrs – polachan paily Feb 17 '21 at 07:25
  • Yiyi You is there any solution on this link ?https://stackoverflow.com/questions/6533087/jquery-detect-value-change-on-hidden-input-field – polachan paily Feb 17 '21 at 07:59