Tengo un formulario con dos tipos de entrada de envío. Dependiendo de qué envío se haga clic, quiero guardar el formulario como borrador o uno correcto.

Estaba pensando en agregar un valor / propiedad a las entradas de envío, tal vez el atributo ng-model.

    <form ng-submit="submitNew()">  
            <div>
                Text:
                <input type="text" ng-model="myForm.text" />
            </div>
            <div>
                <input type="submit" name="correct" value="Add new" />
            </div>  
            <div>
                <input type="submit" name="draft" value="Save as draft" />
            </div>  
        </div>
    </form>

En el controlador, me gustaría agregar esto como un valor booleano ("myForm.isDraft") a los datos enviados con el método POST:

myApp.controller('myAppController', ['$scope','$http','$log',
        function($scope, $http, $log) {

            $scope.submitNew = function() {
              $http({
                  method: 'POST', 
                  url: '/app/submit', 
                  data: {
                     text: $scope.myForm.text,
                     isDraft: $scope.myForm.isDraft,
                  }
              })       
          };

        } 
]);

¿Cómo funciona con entradas de tipo de envío?

Editar: un paso adelante:

Después de cambiar los envíos a:

    <div>
        <input type="submit" ng-click="isDraft = false" value="Add new" />
    </div>  
    <div>
        <input type="submit" ng-click="isDraft = true" value="Save as draft" />
    </div>

Y agregando log dentro de $scope.submitNew = function() veo que $ scope.isDraft es verdadero o falso dependiendo de qué botón se haga clic. Sin embargo, en los datos enviados al back-end siempre es falso.

Controlador ahora:

$scope.submitNew = function() {
     $log.info("Log: isDraft: " + $scope.isDraft); 
              $http({
                  method: 'POST', 
                  url: '/app/submit', 
                  data: {
                     text: $scope.myForm.text,
                     isDraft: $scope.myForm.isDraft = $scope.isDraft,
                  }
              })       
          };

Si cambio isDraft: $scope.myForm.isDraft = $scope.isDraft a isDraft = $scope.isDraft todavía no funciona correctamente.

1
Mr P 21 abr. 2020 a las 18:44

2 respuestas

La mejor respuesta

Intenta ponerlo en una función como

$scope.setDraft = function(isDraft) {
   $scope.isDraft = isDraft;
   //try console.log() to see if the values are correct
   //but if its keeps return false try adding this $scope.$apply();
}

Y en tu html sería así

<div>
    <input type="submit" ng-click="setDraft(false)" value="Add new" />
</div>  
<div>
    <input type="submit" ng-click="setDraft(true)" value="Save as draft" />
</div>

O puede usar la sugerencia @Eric en su lugar usando ng-submit, simplemente cree una nueva función y use ng-click como este

$scope.submitNew = function(isDraft) {
          $http({
              method: 'POST', 
              url: '/app/submit', 
              data: {
                 text: $scope.myForm.text,
                 isDraft: isDraft,
              }
          })       
      };

Y en el html seria asi

<form>  
        <div>
            Text:
            <input type="text" ng-model="myForm.text" />
        </div>
        <div>
            <input type="button" ng-click="submitNew(false)" name="correct" value="Add new" />
        </div>  
        <div>
            <input type="button" ng-click="submitNew(true)" name="draft" value="Save as draft" />
        </div>  
    </div>
</form>
0
Just Passing By 22 abr. 2020 a las 03:17

Cree una variable que se establece con un clic ng en cada botón de envío, luego puede rastrear en cuál se hizo clic.

0
Eric 21 abr. 2020 a las 16:02