How to replace modal dialog with a html page? I need to redirect to a html page without using modal dialog box

I am currenty developing a web-app with the help of jhipster which uses bootstrap and angular js.

When i create an entity(example: Department), it produces CRUD operation for me.

When I try to create a department, it shows me a popup which they call MODAL

But i want this in a seperate page not as a popup.

How to change this from modal to a html file? enter image description here

My state.js file

.state('department.new', {
        parent: 'department',
        url: '/new',
        data: {
            authorities: ['ROLE_USER']
        },
        onEnter: ['$stateParams', '$state', '$uibModal', function($stateParams, $state, $uibModal) {
            $uibModal.open({
                templateUrl: 'app/entities/department/department-dialog.html',
                controller: 'DepartmentDialogController',
                controllerAs: 'vm',
                backdrop: 'static',
                size: 'lg',
                resolve: {
                    entity: function () {
                        return {
                            deptId: null,
                            deptName: null,
                            id: null
                        };
                    }
                }
            }).result.then(function() {
                $state.go('department', null, { reload: true });
            }, function() {
                $state.go('department');
            });
        }]
    })

Is this what you all want me to do?

.state('department.new', {
        parent: 'department',
        url: '/new',
        data: {
            authorities: ['ROLE_USER']
        },
        views: {
            '[email protected]': {
                           templateUrl: 'app/entities/department/department-dialog.html',
                controller: 'DepartmentDialogController',
                controllerAs: 'vm',
            }
        },
                           resolve: {
                    entity: function () {
                        return {
                            deptId: null,
                            deptName: null,
                            id: null
                        };
                    }
                }
          .result.then(function() {
                $state.go('department', null, { reload: true });
            }, function() {
                $state.go('department');
            }),
                  })

Answers:

Answer

Just like any other non popup pages, you already found what you need but with some tiny modifications & corrections like translatePartialLoader.

        .state('department.new', {
                parent: 'department',
                url: '/new',
                data: {
                    authorities: ['ROLE_USER']
                },
                views: {
                    '[email protected]': {
                        templateUrl: 'app/entities/department/department-dialog.html',
                        controller: 'DepartmentDialogController',
                        controllerAs: 'vm'
                    }
                },
                resolve: {
                    translatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
                        $translatePartialLoader.addPart('department');
                        return $translate.refresh();
                    }],
                    entity: function () {
                        return {
                            deptId: null,
                            deptName: null,
                            id: null
                        };
                }
            })
Answer

Please clarify that your current state is department and for creating a new department you have create a state department.new.

If yes then pass the template url directly you don't need to open the uib modal. .state('department.new', { url: '/new/', controller: 'DepartmentDialogController', controllerAs: 'vm', templateUrl: 'app/entities/department/department-dialog.html' })

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.