automate filling in web forms

There is a text box (ID) on the website and I want to put 10,000 data in it. After placing each data in this text box, results are displayed in other text boxes according to the ID.

Textbox ID :

<input class="form-control ltr left text-box single-line" data-val="true" data-val-regex="It is 10 numbers" data-val-regex-pattern="^[0-9]{10}$" data-val-required="*required" id="NId" maxlength="10" name="NId" onblur="LoadInfo()" type="text" value="">

Textobx Name (fill after enter the ID in text box) :

<form action="/Employees/Manager/SavePerson" data-ajax="true" data-ajax-begin="onpostcreatebegin" data-ajax-complete="onpostcreatecomplete" data-ajax-loading="#ajaxloading" data-ajax-method="post" data-ajax-mode="replace" data-ajax-update="#result" id="form0" method="post" novalidate="novalidate"><input name="__RequestVerificationToken" type="hidden" value="asdxBadsP7CpS53654as6dadH3865asdadKhjasdad">        <input type="hidden" name="empId" id="empid" value="0">
    <div class="panel panel-info">
        <div class="panel-body">
            <input data-val="true" data-val-regex="It is 10 numbers" data-val-regex-pattern="^[0-9]{10}$" data-val-required="*required" id="NId" name="NId" type="hidden" value="1234567890">
            <input data-val="true" data-val-number="The field PersonId must be a number." data-val-required="The PersonId field is required." id="PersonId" name="PersonId" type="hidden" value="254102232">
            <input data-val="true" data-val-required="The GuidId field is required." id="GuidId" name="GuidId" type="hidden" value="665xs6asd-cxc2-wq56-8888-30654998b166">
            <div class="form-group">
                <div class="col-md-4">
                    <input class="form-control text-box single-line" data-val="true" data-val-regex="enter the name." data-val-regex-pattern="^[u0600-u06ffs]+$|[u0750-u077fs]+$|[ufb50-ufc3fs]+$|[ufe70-ufefcs]+$|[u06ccs]+$|[u067es]+$|[u06afs]$|[u0691s]+$|^$" data-val-required="*required" id="Firstname" name="Firstname" type="text" value="jack">
                    <span class="field-validation-valid text-danger" data-valmsg-for="Firstname" data-valmsg-replace="true"></span>
                </div>
            </div>

        </div>
    </div>  
</form>

The page will not reload after entering the value in the text box ID. Shows the value on that page. What solution do you suggest? I do not know which method to consider that is the most optimal method. Can you introduce the most optimal and practical method?

Answer

Depending on how complex the task is, you can use either Selenium (Selenium is a script-controlled Browser) with Firefox WebDriver, for example.

It is of course also possible to use the request methods GET and POST as a method with more work but much higher performance.