unable to display the response in popup ( modal)

Question

on clicking a button I call viewJob function and pass jobId , the response data I am trying to display in bootstrap modal. But I am unable to do it ,the values are assigning as local variable.

Even I tried this in html

{{viewJob(model.citynew)}}

If still you want that as $scope function then try below code:

Controller:

$scope.model = {}
$scope.viewJob = function (jobId) {

    UserService.employerJob(jobId).then(function(response) {
        if(response.json.response.statuscode == 0) {  
            $scope.data = response.json.response.data;

            $scope.keyskills = $scope.data.keySkill;

            $scope.model.citynew  = $scope.data.location.city;

            $scope.model.numberofpositionsnew  = $scope.data.numberOfPositions;

            $scope.model.experiencelevelnew  = $scope.data.experienceLevel;

            $scope.model.link  = $scope.data.link;

            $('#viewJobModal1').modal('show');
        }
    });
};

HTML


    
        
            
                View Details of Job
                
            

            
                
                    
                        Company Name  : 
                        {{(model.companynew)}}
                       
                    
                        Job title  :
                        {{model.jobtitlenew}} 
                    
                    
                        Job Description   :
                        {{model.jobdescriptionnew}}

Protozoid · Accepted Answer

I don't think you can use {{viewJob(model.citynew)}} because viewJob takes a jobId as parameter.

It's generally recommended to resolve promises as part of the transition when opening a modal, by passing them in the resolves block.

E.g. Calling the modal in your page's controller

$modal.open({
    templateUrl: 'path/to/modal/template.html',
    controller: 'ModalCtrl',
    controllerAs: 'modalCtrl',
    resolve: {
        job: function () {
            return UserService.employerJob(jobId);
        }
    }
});

Then, in your ModalCtrl, you can grab the job as a dependency display the data however you want in your template

angular.module('AppModule').controller('ModalCtrl', ['job', function (job) {
    modalCtrl = this;

    modalCtrl.keyskills = job.keySkill;
    modalCtrl.citynew = job.location.city;
    modalCtrl.numberofpositionsnew = job.numberOfPositions;
    modalCtrl.experiencelevelnew = job.experienceLevel;
    modalCtrl.companynew = job.company;
    modalCtrl.jobtitlenew = job.jobTitle;
    modalCtrl.jobdescriptionnew = job.jobDescription;
    modalCtrl.link = job.link;
}]);

And then display these in your modal template


    
        
            
                View Details of Job
                
            
            
                
                    
                        Company Name  : 
                        {{(modalCtrl.companynew)}}
                       

                    
                        Job title  :
                        {{modalCtrl.jobtitlenew}} 
                    

                    
                        Job Description   :
                        {{modalCtrl.jobdescriptionnew}}

Hope that helps :)

unable to display the response in popup ( modal)

Answers (1)

Related Questions