0

Tengo un select donde selecciono el tipo de archivo que voy a enviar si es pdf o img, en caso de que sea img le debo enviar image-A y image-B apenas envié las 2 imgs se debe desactivar el boton de enviar, ahora solo desactiva cuando envió 1 img pero necesito enviar primero las 2 y luego desactivar el boton

Tengo el siguiente código:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
    $scope.btnActivePdf = false;
    $scope.btnActiveImg1 = false;
    $scope.btnActiveImg2 = false;
    $scope.uploadFile = function(paramFile) {
        if (paramFile === 'pdf') {
            $scope.btnActivePdf = true;
        }
        if (paramFile === 'image-A') {
            $scope.btnActiveImg1 = true;
        }
        if (paramFile === 'image-A') {
            $scope.btnActiveImg2 = true;
        }

    }
});
<!DOCTYPE>
<html charsfet>
    <head>
<!--CDN ANGULARJS -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
        <script src="script.js"></script>
    </head>
    <style type="text/css" media="screen">
        button[disabled] {
            background-color: red;
        }
    </style>
    <body ng-app="myApp" ng-controller="myCtrl">
        <select ng-model="typeFile">
            <option value="img">Imagen</option>
            <option value="pdf">Pdf</option>
        </select>
        <div>
            <div ng-show="typeFile == 'pdf'">
                <button type="button" ng-click="uploadFile('pdf')">Cargar pdf</button>
            </div>
            <div ng-show="typeFile == 'img'">
                <button type="button" ng-click="uploadFile('image-A')">Cargar img1</button>
                <button type="button" ng-click="uploadFile('image-B')">Cargar img2</button>
            </div>
            <button ng-disabled="btnActivePdf || btnActiveImg1 && btnActiveImg2">Enviar</button>
        </div>
    </body>
</html>

1 respuesta 1

1

En el segundo if de las imagenes tienes que comprobar image-B. Por si acaso he incluido parentesis en el AND del disabled del boton de enviar.

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
    $scope.btnActivePdf = false;
    $scope.btnActiveImg1 = false;
    $scope.btnActiveImg2 = false;
    $scope.uploadFile = function(paramFile) {
    $scope.btnActivePdf = paramFile === 'pdf';

        if (paramFile === 'image-A') {
            $scope.btnActiveImg1 = true;
        }
        if (paramFile === 'image-B') {
            $scope.btnActiveImg2 = true;
        }

    }
});
<!DOCTYPE>
<html charsfet>
    <head>
<!--CDN ANGULARJS -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
        <script src="script.js"></script>
    </head>
    <style type="text/css" media="screen">
        button[disabled] {
            background-color: red;
        }
    </style>
    <body ng-app="myApp" ng-controller="myCtrl">
        <select ng-model="typeFile">
            <option value="img">Imagen</option>
            <option value="pdf">Pdf</option>
        </select>
        <div>
            <div ng-show="typeFile == 'pdf'">
                <button type="button" ng-click="uploadFile('pdf')">Cargar pdf</button>
            </div>
            <div ng-show="typeFile == 'img'">
                <button type="button" ng-click="uploadFile('image-A')">Cargar img1</button>
                <button type="button" ng-click="uploadFile('image-B')">Cargar img2</button>
            </div>
            <button ng-disabled="btnActivePdf || (btnActiveImg1 && btnActiveImg2)">Enviar</button>
        </div>
    </body>
</html>

4
  • no existe una manera de hacerlo mas facil? sin hacer 3 IF
    – zerokira
    el 13 jun. 2018 a las 13:02
  • @TheVicious Esto es lo mejor que se me ocurre ahora mismo. el 13 jun. 2018 a las 13:13
  • ok listo muchas gracias por tu respuesta, con esto ya me hago una idea de lo que necesito.
    – zerokira
    el 13 jun. 2018 a las 13:48
  • @TheVicious Si la respuesta es correcta, marcala por favor. el 13 jun. 2018 a las 13:49

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.