Angularjs - dropdown list inside an inserting form: how to add an item to the dropdown list before submit the form?

Issue

1. I have a modal text entry page in which, among other fields, there is an "author" dropdown list
2. Sometime it happens that there is not the desired author item in the "author" dropdown list
3. so that, the user must close modal text entry page, go to modal "author" entry page to insert the new author and, only then, come back to the modal text entry page to submit the form.

In the following the piece of code to invoke modal text entry page:

vm.popupAddTextForm = function () {        
    var modalInstance = $modal.open({
        templateUrl: '/add_text_modal/add_text_modal.view.html',
        controller: 'add_text_modalCtrl as vm',
        resolve : { modalDati : function () {   
            return {datatips : vm.datatips,
                datatipbyid :  vm.datatipbyid,
                datasubtips : vm.datasubtips,
                dataauts : vm.dataauts  }
            }
        }
    });

Is there a way to invoke modal "author" entry page directly from the modal text entry page by clicking on a "Add new author" button? After inserting new author how to update the relative dropdown list ?

Thnks in advance.

Solution

Thnks Maxim Shoustin and João Fé I followed your suggestions and I got it! I hope to help someone sharing the process:

1. I insert in the html the btn to call vm.popupAddAutForm():

 <div class="col-sm-4"><a ng-click="vm.popupAddAutForm()" class="btn btn-default pull-right" style="width: 100px;">Nuovo Autore</a></div>

2. I put in the modal text entry page the code to invoke vm.popupAddAutForm():

//If Author is not present in the relative dropdown list 
        //I invoke modal author entry page 
        //(the modal text entry page is hidden and all data field remain in stand-by)
        vm.popupAddAutForm = function () {
            var modalInstance = $modal.open({
                templateUrl: '/add_aut_modal/add_aut_modal.view.html',
                controller: 'add_aut_modalCtrl as vm'
            }); 
            //after author insert I recall RestFul API to retrieve authors again and 
            //update the relative dropdown list 
            modalInstance.result.then(function(data) {
                //refresh only the author dropdown list;
                Data.AllAutori()
                    .then(function (response) { 
                    vm.dataauts = {auts: response.data};
                    //alert(JSON.stringify(vm.datasubtips.subtips));
                })
            }); 
        }

3. and the result is just as the following images: modal text entry page modal author entry page and hidden modal text entry page

Answered By - visineri