In Jhipster, I am not able to change the title of the page. Whenever I change the title in index.html, the title automatically changes to the default title. (maybe because of JS). Kindly help...!
Refer the below code to change title of the pages based on routes by pageTitle.
export const userMgmtRoute: Routes = [
{
path: 'user-management',
component: UserMgmtComponent,
resolve: {
'pagingParams': UserResolvePagingParams
},
data: {
pageTitle: 'userManagement.home.title'
}
},
{
path: 'user-management/:login',
component: UserMgmtDetailComponent,
data: {
pageTitle: 'userManagement.home.title'
}
}
];
Reference : https://github.com/jhipster/jhipster-sample-app-ng2/blob/master/src/main/webapp/app/admin/user-management/user-management.route.ts
It seems like I needed to change the constant HOME_ROUTE in:
src/main/webapp/home/home.route.ts
It has a pageTitle attribute which needs to be changed accordingly. I guess Jhipster does this for security purposes.
Thanks a lot guys.
Related
I would like to know how can I minimize a prime ng dialog box. I read this but it is not working in Angular 7.
Also, as per their site here, the property minimizable is not present
Also I am using the dialogService of primeng. Is there any way that I can minimize the dialog and continue working.
Demo code for reference where I am using dialog service to open the angular component:
showPopup(header: string, groupName: string, controlName: string) {
const dialogRef = this.dialogService.open(StandardParagrahPopupComponent, {
header: header,
width: '60%',
closable: true,
data: {
groupName: groupName
}
});
dialogRef.onClose.subscribe(comments =>
this.onPopupClose(comments, controlName)
);
}
Minimize is not working in PrimeNG for Angular.
It is only working in Primefaces for JavaServletFaces.
The first link you provides leads to Primefaces Showcase, the second to PrimeNG showcase. So it is correct that on the second link you can´t find the minimize feature.
I have deployed a web part to a site collection (where the web part is designed to go) and I am getting errors for 3 particular features on the form.
I am using sp.web for these features.
I have created a 'Hello User' which uses this function:
public _getUser() {
sp.web.currentUser.get().then((user) => {
this.setState({
CurrentUserTitle: user.Title,
FullName: user.Title,
CurrentUser: user.LoginName,
CurrentUserID: user.Id,
CurrentUserEmail: user.Email,
}
A Departments list drop down which populates with an SP list.
public _getDepartments() {
sp.web.lists.getByTitle("Departments").items.get().then((items: any[]) => {
let returnedDepts: IDropdownOption[] = items.map((item) => { return { key: item.Title, text: item.Title }; });
this.setState({ DepartmentsList: returnedDepts });
});
}
A Submit button. The function:
private _onSubmit() {
sp.web.lists.getByTitle('Data and Report Form').items.add({
FullName: this.state.FullName,
UniId: this.state.UniId,
Email: this.state.UserEmail,
Phone: this.state.PhoneNo,
Department: this.state.SelectedDept,
SubDepartment: this.state.SubDepartment,
StartDate: this.state.StartDate,
DiscoveryDate: this.state.DateOfDiscovery,
Details: this.state.IncidentDetails,
PersonalData: this.state.PersonalData
}).then((iar: ItemAddResult) => {
console.log(iar);
let list = sp.web.lists.getByTitle('Data and Report Form');
list.items.getById(iar.data.Id).update({
Title: 'DIBR'+iar.data.Id,
});
this.setState({
JobRef: iar.data.Id,
});
});
}
The form works perfectly in non-local SharePoint workbench served on the actual site it's meant to be deployed on.
When deployed as a package to the site itself and added as a web part it now shows these errors:
HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier).
(Fetch)GET - https://myDomain.sharepoint.com/sites/IncidentReporting/SitePages/_api/web/currentuser
HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier).
(Fetch)GET - https://myDomain.sharepoint.com/sites/IncidentReporting/SitePages/_api/web/lists/getByTitle('Departments')/items
I get a similar message when trying to submit. A I said, these all work on the non-local workbench.
Additional details:
If I add the webpart to the homepage of the modern site as a web part I get these error (different to the ones if I add the webpart to a page):
HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier).
(Fetch)GET - https://MyDomain.sharepoint.com/sites/_api/web/lists/getByTitle('Departments')/items
HTTP404: NOT FOUND - The server has not found anything matching the requested URI (Uniform Resource Identifier).
(Fetch)GET - https://MyDomain.sharepoint.com/sites/_api/web/currentuser
as you can see it's missing the actual site in the URL. Why the difference?
Has anyone got an idea why it's behaving differently when deployed? And why is it showing a different error if I place the web part on different areas of the site collection.
Update: I've attempted to use this:
import pnp from "sp-pnp-js";
public onInit(): Promise<void> {
return super.onInit().then(_ => {
pnp.setup({
spfxContext: this.context
});
});
}
But I don't know how to implement it as onInit is Angular isn't it?
HELP!
T
Figured it out.....
MAKE SURE TO PUT:
https://github.com/SharePoint/PnP-JS-Core/wiki/Using-sp-pnp-js-in-SharePoint-Framework
import pnp from "sp-pnp-js";
// ...
public onInit(): Promise {
return super.onInit().then(_ => {
pnp.setup({
spfxContext: this.context
});
});
In your root .ts file!!!!!
This had me for days!
This issue occurs because the PnP JS API didn’t get the SharePoint context. It is taking the SITEURL + '/SitePages' to get the context.
So, what you need to do is that in the props file, add a new 'siteUrl' property.
export interface IDemoWebPartProps{
description: string;
siteUrl: string;
}
and then in the Webpart.ts file, initialize this property with this value.
public render(): void {
const element: React.ReactElement<IDemoWebPartProps> = React.createElement(
Demo,
{
description: this.properties.description,
siteUrl: this.context.pageContext.web.absoluteUrl
}
);
Finally, In the .tsx file initialize the Web parameter using this property.
let web = new Web(this.props.siteUrl);
and use this to get the data from required lists using pnp-js.
I am trying to create an action that loads a view dynamically based on param passed in url
below is my routes.js
'GET faq/:alias': {actions:'faq'}
in my faq action
module.exports = {
friendlyName: 'FAQ Pages',
inputs: {
alias: {
description: 'the page url',
type: 'string'
}
},
exits: {
success: {
statusCode: 200,
},
notFound: {
responseType: 'notFound',
}
},
fn: async function(inputs, exits) {
console.log('static', inputs.alias);
//something like this - set view tempalatePath
//exits.success.viewTemplatePath = 'faqs/' + inputs.alias;
//load view if exist else throw notFound
return exits.success();
}
};
All my faq's are in a folder, I will check if the physical file exists using require('fs').existsSync() and then load load it
In the action2 format which you are using, you have to use throw to route to an alternate exit. See:
https://sailsjs.com/documentation/concepts/actions-and-controllers
Do not be confused by the documentation here:
https://sailsjs.com/documentation/reference/response-res/res-view
... I don't know what it applies to, but it doesn't apply to action2's in 1.0.
This took me a while to figure out too, but below is best way I found to work. In your faq action, change:
return exits.success();
to this:
return this.res.redirect('faq/' + inputs.alias);
BACKGROUND:
I notice in sails.js action2, when you use 'exits' where success responseType is defined as a 'view', it will not use the view-faq.js file at all, just skips directly to the faq.ejs page. I'm using responseType 'redirect' to go to the view-faq.js first before loading the page.
If you do use responseType 'view' in your exits.success, you would need to add into your action the same code from fn: in your faq.js, and also send the page locals. The problem I found with this method was an issue where the 'me' local somehow wasn't functioning properly with the new page view, which messed up my particular template.
Hope this saves someone else hours of time.
I'm using Kentico 9 and I'd like to be able to use different CK Editor style sets on different pages. I have added a style set to the styles.js file as follows.
CKEDITOR.stylesSet.add("mystyles", [{ name: "testone", element: "p" }]);
Then in the page I've added some JS as per the CK Editor web site.
if (CKEDITOR.currentInstance) {
CKEDITOR.currentInstance.config.stylesSet = "mystyles";
}
When I load the page containing the CK Editor, the style drop down contains the default style set, not the custom one I defined.
Does anyone know how to achieve this?
If I remember it right you need to define your new toolbarset in config.js (CMSAdminControls/CKEditor/config.js) dropdown.
Something like:
config.toolbar_Basic = [
['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'InsertLink', 'Unlink']
];
The other thing - you need to add new option to this dropdown in Webparts application > EditableText webpart> Properties > HTMLAreaToolbar > DataSource
Here's the documentation you need to read.
The dropdown styles are defined in CMS\CMSAdminControls\CKeditor\styles.js, such as:
{ name: 'Italic Title', element: 'h2', styles: { 'font-style': 'italic' } },
You define the name of the style (the name appears in the dropdown), and then the element and style(s) that should be applied.
After editing the file, make sure you clear your browser cache.
As most Kentico admin interface pages are nested and iframe'd, the caching is pretty agressive, and your styles might not appear until cache is cleared.
Well, it's just javascript after all, so you can simply check the url in some if statement or in some switch-case and then apply styles you need. Do you need some code example? You should be able to find many of them on the internet :)
Here is how I solved my issue. I added the following to styles.js:
CKEDITOR.stylesSet.add("my-styles", [
{ name: "Paragraph", element: "p" },
{ name: "Heading 1", element: "h1" }
]);
Then, in the master page for the area of my site that needs to use the "my-styles" style set, I added:
<script>window.ckstyleset = "my-styles"</script>
Finally, in config.js I added:
var styleset = window.ckstyleset ? window.ckstyleset : "default";
config.stylesSet = styleset;
Using this approach I was able to customise the styles listed in the drop down depending on what master page was is use.
SAILS.JS
I have two forder in controller: admin and public.
I want to edit view.js file in config forder.
if controllers file in admin forder, it call a layout: layout-admin
if controllers file in public forder, it call a layout: layout-public
but i don't know do it.
please support for me with this. thank a lot!
You can do what you want, look the doc here : http://sailsjs.org/documentation/reference/configuration/sails-config-views
The layout attributs can only be a string or a boolean, there no way actually to define a layout with a function or for an entire controller.
You can make a feature request to sails to see this feature in a next version.
You can specify layout file in your controller like this :
myAction : function (req, res)
{
var layout = "layout-public";
if(req.session.authenticated)
{
layout = "layout-admin";
}
res.view("myview", {
layout : layout
});
}