Unable to resize a HTML field in service catalog?

srirampappagudi
Tera Expert

Hi All,

I am trying to resize a HTML Field in service catalog when the values are getting added in a table so that I do not need to scroll the values.

var html1 = g_form.getControl('comments');
html1.style.height = (textarea.scrollHeight) + "px";
OR
g_form.getControl('src_cg_bu_data_table_approval').style.height = '200px';

OR

g_form.getControl('src_cg_bu_data_table_approval').setAttribute('style.height', '200px');

I tried all the above from the communities but everything throws a client script error as shown below.

js_includes_sp.jsx?v=05-06-2019_1040&lp=Thu_Jul_04_12_03_20_PDT_2019&c=8_153:67593 (g_env) [SCRIPT:EXEC] Error while running Client Script "BUTableResize": TypeError: Cannot read property 'setAttribute' of null

Is there any UI Script which needs to be enabled to use the Style Attribute?

Please help.

Regards,

Sriram

 

6 REPLIES 6

Oleg
Mega Sage

I can suggest you the following workaround.

You examine sys_id of the variable comments. For example it's 5120f7b94f3abb40b8580ab18110c7cd.

Then you create Client Script of UI Type "Mobile / Service Portal" with the following code:

function onLoad() {
	var document = this.document;
	setTimeout(function () {
		// search IFRAME element
		var control = document.getElementById("sp_formfield_5120f7b94f3abb40b8580ab18110c7cd_ifr");
		control.style.height = "300px";
	}, 500);
}

Be carefully, that the id of element, used in document.getElementById consist from 3 parts: prefix "sp_formfield_", sys_id of HTML variable and suffix "_ifr".

If you use too small value for setTimeout (less the 500) then document.getElementById could not find the iframe element. You can improve the responsibility of the code by usage setInterval instead:

function onLoad() {
	var document = this.document;
	var intervalId = setInterval(function () {
		var control = document.getElementById("sp_formfield_5120f7b94f3abb40b8580ab18110c7cd_ifr");
		if (control != null) {
			clearInterval(intervalId);
		    control.style.height = "300px";
		}
	}, 50);
}

Hi Oleg,

I am not getting any error But the HTML Fields height is not changing at all.

More over these HTML fields appear only when certain drop down values changes.

I tried the above code in "OnChange" for that HTML field when it gets populated but the height does not change and the scroller gets activated as soon as the data increases.

What would be your recommendations?

Please let me know.

find_real_file.png

 

Regards,

Sriram.