Import a CSS in a DCT

Hello.

I would like to know how can i import a css file inside a DCT. I am trying it by using a function in the <script/> tag but i think is not going ok.

function loadStylesheets() {
var f = window.top.formframe.document;
var head = f.getElementsByTagName('head')[0];

var stylesheets = new Array('cssfile.css');

var cssFile = f.createElement("link");
cssFile.setAttribute("rel", "stylesheet");
cssFile.setAttribute("type", "text/css");
cssFile.setAttribute("href", stylesheets[0]);
head.appendChild(cssFile);
alert("...script CSS "+stylesheets[0]+" cargado.");
}

IWEventRegistry.addFormHandler("onFormInit", loadStylesheets);

Can someone tell me what is wrong with this or, if is there another way to achieve this?

Thanks.

Find more posts tagged with

Comments

Javoc

Sorry, the post was not ok with the text. I put again.

Hello.

I would like to know how can i import a css file inside a DCT. I am trying it by using a function in the script section but i think is not going ok.

function loadStylesheets() {
var f = window.top.formframe.document;
var head = f.getElementsByTagName('head')[0];

var stylesheets = new Array('cssfile.css');

var cssFile = f.createElement("link");
cssFile.setAttribute("rel", "stylesheet");
cssFile.setAttribute("type", "text/css");
cssFile.setAttribute("href", stylesheets[0]);
head.appendChild(cssFile);
alert("...script CSS "+stylesheets[0]+" cargado.");
}

IWEventRegistry.addFormHandler("onFormInit", loadStylesheets);

Can someone tell me what is wrong with this or, if is there another way to achieve this?

Thanks.

Adam Stoller

What are you actually trying to achieve?

Javoc

Hi,

I am trying to add the jQuery Auto-Completion functionallity into a DCT in order to be able to present suggestions while the user is typing in a text item.

JQuery Auto-Complete needs some files, one of them is a CSS.

From my last post to now i have achieved the way to add the required CSS and JS into the form that is loaded from the DCT(because with firebug i can see now in the head these files loaded), my problem now is other. The form tries to load them in the head section but TeamSite cannot find them, when it tries it does from the path "/iw-cc/comand/" but i do not know where is this path exactly to put there or in a subdirectory these files.

ISCBorisB

Hi,

I am trying to add the jQuery Auto-Completion functionallity into a DCT in order to be able to present suggestions while the user is typing in a text item.

JQuery Auto-Complete needs some files, one of them is a CSS.

From my last post to now i have achieved the way to add the required CSS and JS into the form that is loaded from the DCT(because with firebug i can see now in the head these files loaded), my problem now is other. The form tries to load them in the head section but TeamSite cannot find them, when it tries it does from the path "/iw-cc/comand/" but i do not know where is this path exactly to put there or in a subdirectory these files.

Darren Ferguson (dazzlad) illustrated the technique here, take a look.
Btw, "/iw-cc" maps to the "/iw-home/httpd/webapps/content_center" Directory

Javoc

Hello, thanls for the link and the localization of the iw home.

I have read how Darren did the inclusion of auto-completion and i followed the technique but i still have problems. The ponit is to know why the the text field(in my case "autoc") does not show the auto-completion. I do not have errors when the page loads and all jquery and css is correctly loaded.

I do not know what else can i do or look to solve my problem, i have been searching on the net but nothing, i have also read the manuals of teamsite but i can not find anything usefull.

Does someone really, really tried the Darren's code successfully? I am not telling that is a fake, is just that following that method does not make auto-completion to be working Smiley Sad

I understand Darren code well, but the point is, as i said before, does not load the auto-completion in the text area. When i apply the same line:

$('input[name=mytext]').autocompleteArray(
['January', 'February', 'March', 'April', 'May'],
{delay: 10,
minChars: 1,
matchSubset: 1,
onItemSelect: function(data){},
onFindValue: function(data){},
autoFill: true,
maxItemsToShow: 10});

in a normal java web application autocompletion works and with firebug i can see this in the field:
(i do not use "<" and ">" in the post because the forum app tries to execute what is inside so i use the character "_" instead)

_input type="text" id="CityAjax" name="CityAjax" value="" style="width: 200px;" autocomplete="off" class="ac_input"_

But, when i apply the same in team site i get this other info:

_input type="text" onblur="parent.api.iw_dispatch_handleOnChange("0",this);" onfocus="_d.h_s("0")" size="55" maxlength="255" id="field_0" name="article/Article - Tab1/autoc" class="iw-formspub-textbox-active"_

As you can see there is no reference to auto-completion anywhere, no class, no attributre, nothing.

This is because i think the problem is in the assignation of the auto-completion feature.

My code is as follows.

_script_
_![CDATA[

var iwInitialised = false;
var loadedScripts = 0;
var formField = null;
var dataJSON= null;

function iwInitialise() {
formField = IWDatacapture.getItem('/article/Article -
Tab1/autoc');
formField.setReadOnly(true);
iwInitialised = true;
}

function waitForIwInitialise() {
if(!iwInitialised) {
setTimeout('waitForIwInitialise()', 500);
} else {
ready();
}
}

function ready() {
//I set manually the array of data in JSON format.
var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July',
'August', 'September', 'October', 'November', 'December'];
dataJSON= months;
loadStylesheets();
}

function loadStylesheets() {
var f = window.top.document;
var head = f.getElementsByTagName('head')[0];

var stylesheets = new Array('/iw/jquery/jquery-autocomplete.css');

//Load of the JQuery Auto-completion CSS
var cssFile = f.createElement("link");
cssFile.setAttribute("rel", "stylesheet");
cssFile.setAttribute("type", "text/css");
cssFile.setAttribute("href", stylesheets[0]);
head.appendChild(cssFile);

loadScripts();
}

function loadScripts() {
var scripts = new Array('/iw/jquery/jquery.js','/iw/jquery/jquery-
autocomplete.js');
var f = window.top.document;
var head = f.getElementsByTagName('head')[0];
//Load of the JQuery JS
var src=scripts[0];
var script = f.createElement('script');
script.setAttribute('src', src);
script.setAttribute('type', 'text/javascript');
head.appendChild(script);
//Load of the JQuery Auto-completion JS
var script = f.createElement('script');
src=scripts[1];
script.setAttribute('src', src);
script.setAttribute('type', 'text/javascript');
head.appendChild(script);

topFrameLoaded();
}

function topFrameLoaded() {
var f = window.top;
f.$('input[name=article/Article - Tab1/autoc]').blur();
f.$('input[name=article/Article - Tab1/autoc]').autocompleteArray(
['January', 'February', 'March', 'April', 'May'],
{delay: 10,
minChars: 1,
matchSubset: 1,
onItemSelect: function(data){},
onFindValue: function(data){},
autoFill: true,
maxItemsToShow: 10});
formField = IWDatacapture.getItem('/article/Article - Tab1/autoc');
formField.setReadOnly(false);
f.$('input[name=article/Article - Tab1/autoc]').focus();
}

$().ready(function() {
waitForIwInitialise();
});

IWEventRegistry.addFormHandler("onFormInit", iwInitialise);

]]_
_/script_

Thanks in advance.
Bye.

AcLog_2013-11-22.zip