Submit form in AngularJs Modal

Question

I'm trying to submit a simple form with input in a modal (popup) written in AngularJs:

myApp.run(function($rootScope, $modal) {

    $rootScope.$on('$stateChangeStart', function(event, toState) {

        if (toState.name == 'statePopup') {

            $modal.open({
                templateUrl : 'popup.html',
                controller : 'AllegatiController',
                backdrop: 'static'
            });

            event.preventDefault();

        } else {

            return;
        }
    })
})

The form html is :

<form>
    <div class="form-group">
        <label>File Name:</label> 
        <input type="text"  ng-model="name"></input>
    </div>
    <button ng-click="save()" class="btn btn-primary">Save</button>

</form>

in my controller.js : the $scope.name came undefined

Updated:

This is my controller:

function myController($scope) {
    console.log("all myController");


     $scope.save = function() {

        var name= $scope.name;
        console.log('name is '+name);


    }
}

Maybe seems that in the run of the model which is defined for all the app missed the $scope parameter ?

What am i missed in my code?

Check this demo: plnkr.co/edit/wJzt73GF9vdfi5vjTmi7?p=preview — Maxim Shoustin
– Maxim Shoustin, Commented Sep 12, 2017 at 15:57
ok , but i want to define my modal in the run function of the app in order to ensure the modal will open from anywhere in the app. I think that it missed the scope attribut in the modal but i don't know how to add it — selma
– selma, Commented Sep 12, 2017 at 16:01

selma · Accepted Answer · 2017-09-13 08:07:46Z

1

Issue solved by updated my ui-bootsrap version up from 0.12.0

This is a link that helped me:

Link angularJs modal submit form

answered Sep 13, 2017 at 8:07

selma

773 silver badges13 bronze badges

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

Comments

axl-code · Accepted Answer · 2017-09-12 17:18:59Z

0

If you have this:

$modal.open({
    templateUrl : 'popup.html',
    controller : 'AllegatiController',
    backdrop: 'static'
});

your controller should be:

myApp.controller('AllegatiController', ['$scope', function ($scope) {
    console.log('all myController');

    $scope.save = function () {
       var name = $scope.name;
       console.log('name is '+name);
    }
}]);

answered Sep 12, 2017 at 17:18

axl-code

2,3241 gold badge17 silver badges25 bronze badges

1 Comment

selma Over a year ago

yes it's like this but with a different definition , the app can recognize the controller, the issue that when i submit the form in the modal, the value doesn't pass to the controller

Collectives™ on Stack Overflow

Submit form in AngularJs Modal

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related