Hi All,
I had a task to display an image hyperlink for the list view column. By clicking the image it will navigate to a page which is styled in print view of page.
At first, I added a single line of text field - PrintForm. Then I create a custom standard view- Print View. 'PrintForm' will be available in 'PrintView.aspx'.
I edit the page at first and then edit the web part which contains the web part.
I wrote a small JS code to achieve the functionality.
SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() {
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
Templates: {
Fields: {
'PrintForm': {'View':function(ctx) {
return String.format("<a href='<CustomizedDisplayForm>.aspx?ID={0}' target='_blank'><img src='<ImageUrl>' width='42' height='42'></a>", ctx.CurrentItem.ID);
}}
}//Fields
}//Templates
});
})
Once I completed the JS code, I appended the path of .js file to JS link in Miscellaneous section. After I saved the changes, the view would like as shown below.
Thanks for reading my post, I'll write another for print section.
I had a task to display an image hyperlink for the list view column. By clicking the image it will navigate to a page which is styled in print view of page.
At first, I added a single line of text field - PrintForm. Then I create a custom standard view- Print View. 'PrintForm' will be available in 'PrintView.aspx'.
I edit the page at first and then edit the web part which contains the web part.
I wrote a small JS code to achieve the functionality.
SP.SOD.executeFunc("clienttemplates.js", "SPClientTemplates", function() {
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
Templates: {
Fields: {
'PrintForm': {'View':function(ctx) {
return String.format("<a href='<CustomizedDisplayForm>.aspx?ID={0}' target='_blank'><img src='<ImageUrl>' width='42' height='42'></a>", ctx.CurrentItem.ID);
}}
}//Fields
}//Templates
});
})
Once I completed the JS code, I appended the path of .js file to JS link in Miscellaneous section. After I saved the changes, the view would like as shown below.
Thanks for reading my post, I'll write another for print section.
No comments:
Post a Comment