01-24-2017 12:02 PM
I am trying to change the height of a third party gadget... "my gadget".
as per instructions I added the gadgetHeight parameter, but there was no affect on the page. And my gadget is the only item on the page. Shouldn't the web part adjust automatically to the height of the page. I think it's a bug.
/3rdpartygadget/files/EmbeddedWebApp.xml?gadgetHeight=700
Solved! Go to Solution.
02-07-2017 08:36 AM
so actually figured it out.
All I had to do is set the container height.
this is in the CSS
body {
background: none transparent;
padding: 0px;
}
#displayFrame {
width:100%;
height:800px;
border: 1px solid;
border-color: green;
}
.sh{
height:800px;
}
and added class to the body tag.
01-24-2017 01:45 PM
The gadgetHeight parameter only works for the LiveData gadgets. For the EmbeddedWebApp gadget, you have to change the height in the EmbeddedWebApp.js file itself (_handleTabVisible).
01-31-2017 12:40 PM
So I tried the height feature setting and I get this...
01-31-2017 12:41 PM
The following is the code:
_handleTabVisible = function () {
_clientLogger.log("_handleTabVisible()");
if ($("#displayOut").html() == "")
{
var html = '<iframe src="' + _urlToLoad + '" id="displayFrame" width="100%" height="700" ></iframe>';
//set the html document's agentout element to the html we want to render
$("#displayOut").html(html);
_clientLogger.log("Setting #displayOut.html to: " + $("#displayOut").html());
// automatically adjust the height of the gadget to show the html
gadgets.window.adjustHeight(700); }
_clientLogger.log("Starting the _checkForTabNotVisible() checker...");
window.setTimeout(_checkForTabNotVisible, 100);
};
01-31-2017 01:47 PM
You shouldn't specify the height in the adjustHeight, so it should be gadgets.window.adjustHeight();
02-02-2017 11:07 AM
Trying to make this take more of the screen, but I just get this.
var html = '<iframe src="' + _urlToLoad + '" id="displayFrame" width="100%" height="800px" ></iframe>';
//set the html document's agentout element to the html we want to render
$("#displayOut").html(html);
_clientLogger.log("Setting #displayOut.html to: " + $("#displayOut").html());
// automatically adjust the height of the gadget to show the html
gadgets.window.adjustHeight(); }
02-02-2017 11:57 AM
Do you get this problem if you revert back to the original URL? When using the provided sample code and only modifying the height attribute, it works fine on my 10.6 system.
Thanx,
Denise
02-07-2017 08:16 AM
I don't quite understand what you mean by revert back.
I am using the embedded gadget sampler control with a modification of height.
Attached are two screen shots, one of the app embedded.
The other of the app NOT embedded.
if ($("#displayOut").html() == "")
{
var html = '<iframe src="' + _urlToLoad + '" id="displayFrame" width="100%" height="800px" ></iframe>';
the app below is embedded. Notice the scroll bar to the right. I didn't put that there.the app
above is NOT embedded.
02-07-2017 08:36 AM
so actually figured it out.
All I had to do is set the container height.
this is in the CSS
body {
background: none transparent;
padding: 0px;
}
#displayFrame {
width:100%;
height:800px;
border: 1px solid;
border-color: green;
}
.sh{
height:800px;
}
and added class to the body tag.
01-05-2018 02:07 PM
This had me banging my head against the wall for hours.
It's important that you add this line to your XML file or nothing you do will change the height:
<Require feature="dynamic-height" />
Here's an example:
<Module>
<ModulePrefs title="AgentWebMessage"
description="AgentWebMessageGadget">
<Require feature="dynamic-height" />
<Require feature="settitle" />
<Require feature="pubsub-2" />
<Require feature="setprefs" />
<Require feature="loadingindicator">
<Param name="manual-dismiss">false</Param>
<Param name="loading-timeout">15</Param>
</Require>
</ModulePrefs>
Hope this helps!
01-08-2018 10:13 AM
Hi Joe,
Thank you for sharing your lessons learned with the community!
Thanx,
Denise
10-23-2018 11:23 PM
Hi All,
I trying to add a permalink to Finesse using the CUIC Sample gadget.
My height doesn't seem to be changing. Can you please clarify what you mean when you mention "and added class to the body tag."?
Here is a copy of my CUIC.css
------------
/**
* Default attributes for gadget body.
*/
body {
background: none transparent;
padding: 0px;
}
#frame1 {
width:100%;
height:800px;
}
#agentout {
margin:4x;
}
------------
10-24-2018 09:36 AM - edited 10-24-2018 09:37 AM
Hi,
For the CUIC sample gadget, the code in the JS is: '<iframe src="' + permalink + ' " id="frame1" width="900" height="300"></iframe>'
You should be able to change the height directly in the JS. Also, make sure the gadget is not loading from cache after you make the change, you can use the &nocache option.
Thanx,
Denise
06-23-2020 06:48 AM
i have just started learning the basics of java scripting and jquery, i created one simple html content along with script tags, which basically creates a hyperlink of a website and when u click on it it opens up the website in the gadget. Below is the xml file
<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Sample Gadget"
description="Sample Gadget"
thumbnail="http://localhost:8082/">
<Require feature="dynamic-height" />
<Require feature="settitle" />
<Require feature="pubsub-2" />
<Require feature="setprefs" />
<Require feature="loadingindicator">
<Param name="manual-dismiss">false</Param>
<Param name="loading-timeout">10</Param>
</Require>
</ModulePrefs>
<Content type="html">
<![CDATA[
<!DOCTYPE html>
<!-- Styling -->
<body class="claro">
<!-- Sample Gadget -->
<script type="text/javascript">
var a = prompt('What is your name?', '');
document.write("Welcome " + a);
</script>
<p><a href="https://www.xxx.com/">Broadridge</a></p>
</body>
]]>
</Content>
</Module>
But the website height is not auto adjusting, i have tried with and without CSS sheet.
06-23-2020 08:17 AM
ok, it worked after i added below paramter under moduleprefs tag
description="Sample Gadget" width="780" height="900"
Discover and save your favorite ideas. Come back to expert answers, step-by-step guides, recent topics, and more.
New here? Get started with these tips. How to use Community New member guide