focus animation not working in the form

Automate.cshtml

`<div class="row clearfix" ng-controller="app.views.automate as vm">

<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">

    <div class="card">

        <div class="header">

            <h2>

                Automate

            </h2>

        </div>

        <div class="body">





            <div id="wizard-step-container">

                <ul class="nav nav-pills nav-justified">

                    <li ng-repeat="step in vm.steps" ng-class="{'active':step.step == vm.currentStep}"><a ng-click="vm.gotoStep(step.step)" href="">{{step.step}}. {{step.name}}</a></li>

                </ul>

            </div>



            <div id="wizard-content-container">

                <ng-include src="vm.getStepTemplate()"></ng-include>

            </div>



            <div id="wizard-navigation-container">

                <div class="pull-right">

                    <span class="btn-group">

                        <button ng-disabled="vm.currentStep <= 1" class="btn btn-default" name="previous" type="button" ng-click="vm.gotoStep(vm.currentStep - 1)"><i class="fa fa-arrow-left"></i> Previous step</button>

                        <button ng-disabled="vm.currentStep >= vm.steps.length" class="btn btn-primary" name="next" type="button" ng-click="vm.gotoStep(vm.currentStep + 1)">Next step <i class="fa fa-arrow-right"></i></button>

                    </span>

                    <button ng-disabled="vm.currentStep != vm.steps.length" class="btn btn-success" name="next" type="button" ng-click="vm.save()"> <i class="fa fa-floppy-o"></i> Save</button>

                </div>

            </div>

        </div>

    </div>

</div>

</div>`

Step3.cshtml

`<div class="step3">

<form id="frm_create_user" name="userCreateForm" novalidate>

    <div class="row clearfix" style="margin-top:10px;">

        <div class="col-sm-12">

            <div class="form-group form-float">

                <div class="form-line">

                    <input id="center" type="text" name="CenterName" ng-model="vm.location['abq'].center" required maxlength="32" minlength="2" class="validate form-control">

                    <label for="center" class="form-label">ABQ</label>

                </div>

            </div>

        </div>

    </div>

</form>

</div>`

I found that the jquery “On focus event” not fired up but i just copied the code from creatUser.cshtml but there it is working fine.

Abp package version - 3.7.0 base framework: .Net Framework

[realLiangshiwei]

This has nothing to do with abp

[Gardens18]

Found the solution:

Since the “form content” is loaded into the wizard as partial view ( seperate .cshtml), the default focus event declared in the admin.js will not be affected. So I tried “On” event , it works fine now. I wonder that they have already done it for “label” but not for the “input”. Check the image below for reference.