Welcome Serena Central users! CLICK HERE
The migration of the Serena Central community is currently underway. Be sure to read THIS MESSAGE to get your new login set up to access your account.
Highlighted
derekcc Absent Member.
Absent Member.
5058 views

How do i include CSS files to a specific form?

Jump to solution
Hi All,
I try to include a javascript file and which comes with a css file for styling.
But I don't see a way to include this in SBM Composer, any idea for this?

Thanks,
Derek
0 Likes
1 Solution

Accepted Solutions
dsheaffe Trusted Contributor.
Trusted Contributor.

Re: How do i include CSS files to a specific form?

Jump to solution
To refer to a css on a custom form all you need to do is add a HTML/Javascript widget and include the following:



Edit the href to point to where you have saved your css file.
0 Likes
6 Replies
dsheaffe Trusted Contributor.
Trusted Contributor.

Re: How do i include CSS files to a specific form?

Jump to solution
To refer to a css on a custom form all you need to do is add a HTML/Javascript widget and include the following:



Edit the href to point to where you have saved your css file.
0 Likes
derekcc Absent Member.
Absent Member.

Re: How do i include CSS files to a specific form?

Jump to solution
David Sheaffe wrote:

To refer to a css on a custom form all you need to do is add a HTML/Javascript widget and include the following:



Edit the href to point to where you have saved your css file.

Well, this is acceptable but i would like it to be maintained on Application Repository so i don't need to deploy it separately, any idea with that?
yuvaraaj Absent Member.
Absent Member.

Re: How do i include CSS files to a specific form?

Jump to solution
Hi,

You can't apply different stylesheets to different parts of a page. You have a few options:

The best is to wrap the different parts of the page in divs with class names:


#section1 a{color:red}
#section2 a{color:blue}

this will make all links inside an element with id section1 be red, and all links inside an element with id section2 be blue..







So, Use different class for each part in your web page and customize the CSS code for each class.
0 Likes
phpinterview199 Absent Member.
Absent Member.

Re: How do i include CSS files to a specific form?

Jump to solution
To link a CSS file with your HTML file you have to write the next script on your html file inside the head tag.



If you have the CSS file in the same folder of your html file you only have to write the name of your CSS file, like this.(I recommend you to have the files in different folders associated by the type).



If yo are working with a bootstrap theme you can add the the link of the file



To link a Js file with your Html you only have to add the source of the script inside the body tag or outside it does not matter. (I never tried to put it inside the head tag but I do not recommend to do that ).



If you have the Js file in the same folder of your html file you only have to write the name of your Js file, like this.(I recommend you to have the files in different folders associated by the type).



If you are working with libraries like JQuery you can add the URL of the library in the source.

oveiya Absent Member.
Absent Member.

Re: How do i include CSS files to a specific form?

Jump to solution
I really like your blog. You make it interesting to read and entertaining at the same time. I can't wait to read more from you.
https://www.gangboard.com/business-intelligence-training/qlik-sense-training?utm_source=backlinks&utm_medium=forum&utm_campaign=coursepage&utm_term=qlik&utm_content=oveiya
0 Likes
markquah Absent Member.
Absent Member.

Re: How do i include CSS files to a specific form?

Jump to solution
Following URL show how to load css/script to be loaded dynamically:

http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml

I create a javascript file with the following function:

//===== Load CSS File since SBM does not allowed upload of CSS
function loadjscssfile(filename, filetype)
{
if (filetype=="js"){ //if filename is a external JavaScript file
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", filename);
}
else if (filetype=="css"){ //if filename is an external CSS file
var fileref=document.createElement("link");
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", filename);
}
if (typeof fileref!="undefined")
document.getElementsByTagName("head")[0].appendChild(fileref);
}

Then you can either run the function through Form Action->execute javascript or in another javascript:

loadjscssfile(file, "css");

Cheers,
Mark
0 Likes
The opinions expressed above are the personal opinions of the authors, not of Micro Focus. By using this site, you accept the Terms of Use and Rules of Participation. Certain versions of content ("Material") accessible here may contain branding from Hewlett-Packard Company (now HP Inc.) and Hewlett Packard Enterprise Company. As of September 1, 2017, the Material is now offered by Micro Focus, a separately owned and operated company. Any reference to the HP and Hewlett Packard Enterprise/HPE marks is historical in nature, and the HP and Hewlett Packard Enterprise/HPE marks are the property of their respective owners.