Как очистить поле ввода при нажатии кнопки в ионной 1

Question

Я новичок в ionic 1. Проблема заключается в нажатии кнопки «Отправить», поля ввода не очищаются. При нажатии кнопки после отправки данных на сервер она перезагружает ту же страницу, но с уже введенными полями. html

     <div style="margin-left: 20px;margin-right: 20px;margin-top: 55px;"> 
        <div class = "list">
           <label class = "item item-input item-stacked-label">
           <!-- <span class = "input-label">Name</span> -->
           <input type = "text" placeholder = "Name" required ng-model="name" clearInput="true"/>
           </label>
        </div>
        <div class = "list">
           <label class = "item item-input item-stacked-label">
           <!-- <span class = "input-label">Mobile Number</span> -->
           <input type = "tel"maxlength="10" clearInput="true" placeholder = "Mobile No." pattern="[1-9]{1}[0-9]{9}" required ng-model="mobile" />
           </label>
        </div>
        <div class="padding text-right" style="margin-top: -12px;">
           <button class="button button-positive " ng-click="enter(name,mobile)" style="width: 100%;">
           Submit
           </button>
        </div>
 </div>

js

$scope.enter = function (name,mobile) {
                if (name == null) {
                    var alertPopup = $ionicPopup.alert({
                        template: 'Please Enter Name!'
                    });

                } else if (mobile == null) {
                    var alertPopup = $ionicPopup.alert({
                        template: 'Please Enter Mobile Number!'
                    });

                }
                 else  {
        $ionicLoading.show({
                    template: '<ion-spinner></ion-spinner><p>Loading...</p>'
                          });
       var link = 'http://mountsystem/mobileapi/coreapi.php';
            var datasend = $.param({
                request_code: 'demo_attendance',
                batch_id:$stateParams.batchId,
                mobile_no: mobile,
                student_name: name,
                franchise_id: $scope.userDetails.franchise_id,
                entered_by:$scope.userDetails.employee_id
        });
        console.log(datasend);
        $http.post(link, datasend, config)
                .success(function (response) {
                    $ionicLoading.hide();
                    console.log(response);
                    if (response.response_code == 'STATUS_OK') {
                        $scope.list = response;
                        console.log($scope.list);                             
                        var alertPopup = $ionicPopup.alert({
                          title: 'Hurrayy',
                          content: 'Successfully Submitted !'
                        })

                    } else {

                        var alertPopup = $ionicPopup.alert({
                            title: 'Error!',
                            template: response.msg
                        });
                    }
                }).error(function (response) {
            $ionicLoading.hide();
            var alertPopup = $ionicPopup.alert({
                title: 'ServerError!',
                template: 'ServerError' + response
            });
        });
}}

Я просто хочукак только я нажму кнопку «Отправить», оба поля ввода (имя пользователя и номер мобильного телефона) станут свободными, поэтому я снова ввел новые данные.Пожалуйста, помогите мне решить эту проблему.

Answer 1

Измените переменную ng-модели с кодом ниже

 <div style="margin-left: 20px;margin-right: 20px;margin-top: 55px;"> 
        <div class = "list">
           <label class = "item item-input item-stacked-label">
           <!-- <span class = "input-label">Name</span> -->
           <input type = "text" placeholder = "Name" required ng-model="data.name" clearInput="true"/>
           </label>
        </div>
        <div class = "list">
           <label class = "item item-input item-stacked-label">
           <!-- <span class = "input-label">Mobile Number</span> -->
           <input type = "tel"maxlength="10" clearInput="true" placeholder = "Mobile No." pattern="[1-9]{1}[0-9]{9}" required ng-model="data.mobile" />
           </label>
        </div>
        <div class="padding text-right" style="margin-top: -12px;">
           <button class="button button-positive " ng-click="enter(data.name,data.mobile)" style="width: 100%;">
           Submit
           </button>
        </div>
 </div>

$scope.data = {};

$scope.enter = function (name,mobile) {
                if (name == null) {
                    var alertPopup = $ionicPopup.alert({
                        template: 'Please Enter Name!'
                    });

                } else if (mobile == null) {
                    var alertPopup = $ionicPopup.alert({
                        template: 'Please Enter Mobile Number!'
                    });

                }
                 else  {
        $ionicLoading.show({
                    template: '<ion-spinner></ion-spinner><p>Loading...</p>'
                          });
       var link = 'http://mountsystem/mobileapi/coreapi.php';
            var datasend = $.param({
                request_code: 'demo_attendance',
                batch_id:$stateParams.batchId,
                mobile_no: mobile,
                student_name: name,
                franchise_id: $scope.userDetails.franchise_id,
                entered_by:$scope.userDetails.employee_id
        });
        console.log(datasend);
        $http.post(link, datasend, config)
                .success(function (response) {
                    $ionicLoading.hide();
                    console.log(response);
                    if (response.response_code == 'STATUS_OK') {
                        $scope.list = response;
                        console.log($scope.list);
                        $scope.data.mobile = '';
                         $scope.data.name = '';                 
                        var alertPopup = $ionicPopup.alert({
                          title: 'Hurrayy',
                          content: 'Successfully Submitted !'
                        })

                    } else {

                        var alertPopup = $ionicPopup.alert({
                            title: 'Error!',
                            template: response.msg
                        });
                    }
                }).error(function (response) {
            $ionicLoading.hide();
            var alertPopup = $ionicPopup.alert({
                title: 'ServerError!',
                template: 'ServerError' + response
            });
        });
}}

Answer 2

Я очень удивлен решением, но это решение сработало для меня, проблема заключалась в том, чтобы вместо установки значения непосредственно внутри объекта $scope, я должен был поместить его в любой объект объекта $ scope, подобный этому

<input type="text" placeholder="Enter new todo" ng-model="data.newtodo"> сначала измените модель поля ввода на такую, как это

и в моем контроллере сверху

$scope.data = {};

и после успешного обратного вызова

$scope.data.newtodo = "";

Answer 3

Попробуйте установить имя и телефонные переменные на "" в вашем файле .js.Это очистит поля спереди.

Кроме того, почему вы все еще используете Ionic 1. Я рекомендую перейти на Ionic 3, ожидая, что четвертая версия станет действительно стабильной.