0

I have an active field that is true or false, I want to replace the text with the checkbox

I want that during the change I could click on the check mark and the change took effect, that is, if the check box is true, if there is no check mark, then false

<div class="row">
<div class="col-lg-4 col-sm-12" style="margin: 15px">
    Активность Пользователя:
</div>
<div class="col-lg-6 col-sm-10" style="margin: 5px;">
        <textarea style="display: inline-block; width: 100%; height:3rem;  resize: none;" ng-model="user.active"
                  ng-if="editActive"/>
    <div ng-if="!editActive" style="display: inline-block; width: 100%; overflow-wrap: break-word">
        {{user.active}}
    </div>
</div>
<div class="col-lg-1 col-sm-1">
    <button ng-click="changeActive()"
            ng-if="editActive">
        <i class="glyphicon glyphicon-ok"
           style="size: 20px"/>
    </button>
    <button ng-click="changeActive()"
            ng-if="!editActive">
        <i class="glyphicon glyphicon-pencil"
           style="size: 20px"/>
    </button>
</div>

I do it this way, but not saved

  <div class="row">
    <div class="col-lg-4 col-sm-11" style="margin: 15px">
        Активность Пользователя:
    </div>
    <div class="col-lg-6 col-sm-1" style="margin: 5px;">
        <input type="checkbox" ng-model="user.active">
    </div>
</div>

angular code

(function () {
'use strict';

angular
    .module('marathon.controllers')
    .constant()
    .controller('EditUserCtrl', function ($scope, $stateParams, dialogs, $http, $alert, $state, $location, $window,
                                          dashboardService, defaultGridOptions, dateTimeFormat, appService) {
        $scope.getUser = function () {
            $http.post("http://localhost:9009/api/users/getUser", {id: $stateParams.id})
                .then(function (response) {
                    $scope.user = response.data;
                })
        };

        $scope.getUser();

        $scope.editFirstname = false;
        $scope.editLastname = false;
        $scope.editUsername = false;
        $scope.editEmail = false;
        $scope.editPassword = false;
        $scope.editActive = false;

        $scope.changeFirstname = function () {
            $scope.editFirstname = !$scope.editFirstname
        };
        $scope.changePassword = function () {
            $scope.editPassword = !$scope.editPassword
        };
        $scope.changeActive = function () {
            $scope.editActive = !$scope.editActive
        };
        $scope.changePassword = function () {
            $scope.editPassword = !$scope.editPassword
        };
        $scope.changeLastname = function () {
            $scope.editLastname = !$scope.editLastname
        };
        $scope.changeUsername = function () {
            $scope.editUsername = !$scope.editUsername
        };
        $scope.changeEmail = function () {
            $scope.editEmail = !$scope.editEmail
        };
        $scope.save = function () {
            if (!validateBeforeSave()) {
                $alert({
                    title: 'Заполните все поля',
                    content: $scope.user.username,
                    templateUrl: "alertTemplate.html",
                    duration: 5,
                    placement: 'top-right',
                    type: "danger",
                    show: true
                });
                return
            }
            dialogs.confirmation("Сохранить изменения в книге " + $scope.user.username + "?").then(function () {
                $http.post("http://localhost:9009/api/users/save", $scope.user)
                    .then(function (response) {
                        $alert({
                            title: '',
                            content: 'Пользователь сохранен',
                            templateUrl: "alertTemplate.html",
                            duration: 5,
                            placement: 'top-right',
                            type: "info",
                            show: true
                        });
                        $scope.user = response.data;
                        $state.go('app.dashboard');
                    })
            });


        };
        $scope.delete = function () {
            dialogs.confirmation("Удалить пользователя " + $scope.user.username + "?").then(function () {
                $http.post("http://localhost:9009/api/users/delete", $scope.user)
                    .then(function () {
                        $alert({
                            title: '',
                            content: 'Пользователь удален',
                            templateUrl: "alertTemplate.html",
                            duration: 5,
                            placement: 'top-right',
                            type: "info",
                            show: true
                        });
                        $state.go('app.dashboard');
                    })
            });
        };
        $scope.cancel = function () {
            dialogs.confirmation("Все несохраненные изменения будут удалены. Вернуться на главную страницу?").then(function () {
                $state.go('app.dashboard');
            })
        };


        function validateBeforeSave() {
            if (!$scope.user.firstName ||
                !$scope.user.lastName ||
                !$scope.user.username ||
                !$scope.user.email ||
                !$scope.user.password ||
                    !$scope.user.active||
                $scope.user.firstName.trim() == "" ||
                $scope.user.lastName.trim() == ""
                || $scope.user.username.trim() == ""
                || $scope.user.email.trim() == ""
                || $scope.user.password.trim() == ""||
                    $scope.user.active.trim() ==""
            ) {
                return false;
            }
            else return true;
        }
    });

})();

3
  • Please show the Angular JS code. Alternatively, copy / paste an example from the angular docs. Commented Jan 24, 2019 at 11:05
  • I added angular code editUser Commented Jan 24, 2019 at 11:08
  • Thanks, that looks good. The only problem I can thing of is the object $scope.user. Could you do a console.log($scope.user); to see if it's in the right shape, e.g. $scope.user.active exists Commented Jan 24, 2019 at 11:12

1 Answer 1

1

I solved the problem, were unnecessary ! $ scope.user.active || and $ scope.user.active.trim () == ""

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.