Thanks ever so much, it's probably something to do with my lack of experience for AngularJS but I really appreciate your help.
So I'm still stuck, I've read up on the ui-router and it looks really clever, I like it but I cannot make it work for me. I get on JS errors it simple refuses to do anything.
Here is the snippet from the app.js
if (abp.auth.hasPermission('Pages.Tenants')) {
$urlRouterProvider.otherwise("/host/tenants"); // Entrance page for the host
$stateProvider.state('host.tenants', {
url: '/tenants',
templateUrl: '~/App/host/views/tenants/index.cshtml',
menu: 'Organisations'
});
$stateProvider.state('host.tenants.create', {
url: '/create',
templateUrl: '~/App/host/views/tenants/create.cshtml'
});
$stateProvider.state('host.tenants.edit', {
url: '/edit/:tenantId',
templateUrl: '~/App/host/views/tenants/edit.cshtml'
});
}
if (abp.auth.hasPermission('Pages.Administration.Host.Settings')) {
$stateProvider.state('host.settings', {
url: '/settings',
templateUrl: '~/App/host/views/settings/index.cshtml',
menu: 'Administration.Settings.Host'
});
}
I'm hoping that the nesting of host.tenants and host.tenants.create and host.tenants.edit gove the urls #/host/tenant, #/host/tenant/create and #host/tenant/edit respectively.
This is how I'm trying to call the create function (it doesn't work even if you try the url manually though).
<div class="col-xs-6 text-right">
<a ng-if="vm.permissions.create" class="btn btn-primary blue" ng-href="#/host/tenants/create/"><i class="fa fa-plus"></i> @L("CreateNewTenant")</a>
</div>
The Create.cshtml
<div ng-controller="host.views.tenants.create as vm">
<div class="row margin-bottom-5">
<div class="col-xs-6">
<div class="page-head">
<div class="page-title">
<h1>
<span>PAGE_NAME</span> <small>PAGE_NAME_INFO</small>
</h1>
</div>
</div>
</div>
<div class="col-xs-6 text-right">
<button class="btn btn-primary blue" @*ng-click="vm.doIt1()"*@><i class="fa fa-plus"></i> ACTION_ONE</button>
<button class="btn btn-primary blue" @*ng-click="vm.doIt2()"*@><i class="fa fa-plus"></i> ACTION_TWO</button>
</div>
</div>
<div class="portlet light">
<div class="portlet-body">
<p>PAGE_CONTENT_HERE</p>
</div>
</div>
</div>
The create js file :
(function () {
appModule.controller('host.views.tenants.create', [
'$scope', '$modal', 'uiGridConstants', 'abp.services.app.tenant',
function ($scope, $modal, uiGridConstants, tenantService) {
var vm = this;
$scope.$on('$viewContentLoaded', function () {
Metronic.initAjax();
});
//start from here...
}
]);
})();
I'd really appreciate some help on this as I've now spent an entire day on this function and it's running late.
Thanks
OK, I've made some headway, but I think I've not done the routing correctly :
if (abp.auth.hasPermission('Pages.Tenants')) {
$urlRouterProvider.otherwise("/host/tenants"); // Entrance page for the host
$stateProvider.state('host.tenants', {
url: '/tenants',
templateUrl: '~/App/host/views/tenants/index.cshtml',
menu: 'Organisations'
});
$stateProvider.state('host.tenants.create', {
url: '/tenants/create',
templateUrl: '~/App/host/views/tenants/create.cshtml'
});
$stateProvider.state('host.tenants.edit', {
url: '/tenants/edit/:tenantId',
templateUrl: '~/App/host/views/tenants/edit.cshtml'
});
}
On the create button I have:
<div class="col-xs-6 text-right">
<button ng-if="vm.permissions.create" class="btn btn-primary blue" href="#/tenants/create/"><i class="fa fa-plus"></i> @L("CreateNewTenant")</button>
</div>
I think I have the navigation routes wrong maybe, I'm just going to have some dinner and then I will come back to it :-)
Hi,
Sorry if this sounds like a too simple question :-)
I've extended Tenant but I'd like the edit or create to go to new pages rather than dialogue panel.
I figure I need to modify:
vm.editTenant and vm.createTenant js funcitons in index.js, is there a sample in AbpBoilerPlate that would give me a correct implementation of the navigation.
Thanks
John