What events does an <input type="number" /> fire when its value is change ?

Ahmed Abd El Aziz 310 Reputation points
2023-08-28T22:22:13.13+00:00

my question is 

What events does an <input type="number" /> fire when its value is changed ?

I working on .net application asp.net mvc . I using input text numbers have up and down arrows 

up increase and down decrease 

which event fire when press on this two arrows

@Html.EditorFor(model => model.DirectManager, new { htmlAttributes = new { @class = "form-control", id = "txtDirectManagerId" } })

and this property as below 

public class requester

{

public int DirectManager{get;set;}

}

so what event i will use when call jquery api

 $(document).ready(function () {
        $("#txtLineManagerId").autocomplete({
            source: function (request, response) {
                var searchText = $("#txtLineManagerId").val();
                console.log("search text" + searchText)
                $.ajax({
                    url: '@Url.Action("GetAllEmployeeBasedSearchText", "Resignation")',
                    data: { searchText: searchText },
                    method: "GET",
                    dataType: "json",
                    success: function (data) {
                        /* console.log("data is " + data);*/
                        response($.map(data, function (item) {
                            console.log("data is" + item.EmployeeID);
                            /*$('#LineManagerName').val(item.EmployeeName);*/
                           // $('#LineManagerName').html(item.EmployeeName);
                            return { label: item.EmployeeID, value: item.EmployeeID, employeeName: item.EmployeeName };

                        }))

                    }
                });
            },
            position: { my: "right top", at: "right bottom" },
            appendTo: '#searchContainer',
            select: function (event, ui) {
                // Update LineManagerName input with the selected Employee Name
                $("#LineManagerName").val(ui.item.employeeName);
                $("#selectedEmployeeName").val(ui.item.employeeName);
            },
            minLength: 4,
           // appendTo: "#searchContainer"
        });
  });
ASP.NET
ASP.NET
A set of technologies in the .NET Framework for building web applications and XML web services.
3,240 questions
0 comments No comments
{count} votes

Accepted answer
  1. Lan Huang-MSFT 25,386 Reputation points Microsoft Vendor
    2023-08-29T02:42:33.34+00:00

    Hi @Ahmed Abd El Aziz,

    The answers to your three questions all have to do with the onchange event.

    The onchange event occurs when the value of an HTML element is changed.

    @Html.EditorFor(model => model.DirectManager, new { htmlAttributes = new { onchange = "OnChangeEvent()", @class = "form-control", id = "txtDirectManagerId" } })
    
    <script>
        function OnChangeEvent() {
            alert("value is changed");
    
        }
    </script>
    

    3

    <input type="number" onchange="myFunction()" />
    
    <script>
      function  myFunction(){
          alert("change");
        }  
    </script>
    

    4

    Best regards,
    Lan Huang


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    0 comments No comments

1 additional answer

Sort by: Most helpful
  1. Bruce (SqlWork.com) 54,711 Reputation points
    2023-08-29T00:49:05.8+00:00

    There are several events you could use, but you probably want the oninput event:

    https://www.w3schools.com/jsref/event_oninput.asp

    1 person found this answer helpful.
    0 comments No comments