 |
|||||
|
As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only. Join the TIBCO Community
Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community. | |||||
Focal Point 
Focal Point Forums WebFOCUS/FOCUS Forum on Focal Point Optionally disabling and greying out list boxes
Focal Point Forums WebFOCUS/FOCUS Forum on Focal Point Optionally disabling and greying out list boxes Read-Only TopicGo | Search | Notify | Tools |
| Optionally disabling and greying out list boxes | Login/Join |
| Silver Member |
I have a requirement. When the report type is changed, the list box(es) not applicable for the report type are disabled and grey. What is the coding technique that will make this happen? Thanks in advance. | ||
|
| Expert |
You'll have to resort to javascript. Add an onChange event to your combo box and direct it to a javascript function <SELECT id=ITEM1 .... onChange=checkcntls(); .... </SELECT>Within the javascript determine the value selected in your combo box and hide / greyout the relevant controls as required. T
| |||||||||
|
| Expert |
To provide you with an example, try the following. It was initially created using Resource layout Painter (yes, I know I don't use it normally, but I thought that I should give an example where you folks can compare it to the HTML code produced from the GUI  ). I have aligned the code so that it (should) fit in this window without looking too awful!Basically, there are four selects. The first one is a report selector that calls a javascript function when the selected value is changed. The other three have names Country, Car and Model (the names will be used as the WF variable names). When the report selector is changed, the javascript will disable those SELECTS where the datatype eq 1 and the name attribute eq the selected value. To hide or show the SELECTS instead, just uncomment the line for el.style.visibility = #value; . <HTML>
<HEAD>
<TITLE>HtmlPage
</TITLE>
<META content="WebFocus Report Layout Painter" name ="Generator">
<SCRIPT id=IbiOptionsScript type=text/javascript>
var cgipath = "cgipath";
var ibirls = "ibirls";
var multidrill = "multidrill";
var mntFormValidate = "mntFormValidate";
var dyncalendar = "dyncalendar";
var ibiOptions = new Array(cgipath,ibirls,mntFormValidate,multidrill);
</SCRIPT>
<SCRIPT id=nls src="/ibi_html/javaassist/nls.js" type=text/javascript>
</SCRIPT>
<SCRIPT id=ibigbl src="/ibi_html/javaassist/ibi/html/js/ibigbl.js" type=text/javascript>
</SCRIPT>
<SCRIPT id=ibigblloadCss type=text/javascript>
ibigblloadCss(null);
</SCRIPT>
</HEAD>
<BODY onload=OnLoad()>
<!--startibiitems-->
<FORM method=post name ="form">
<INPUT type=hidden value=somefex name ="IBIF_ex">
<INPUT id=IBIAPP_app type=hidden value=anthony name ="IBIAPP_app">
<SELECT id=ITEM1 onChange=checkctrl(); style="Z-INDEX: 1; LEFT: 50px; WIDTH: 150px;
POSITION: absolute; TOP: 25px; HEIGHT: 22px" name ="Report" elementname="combobox1"
elementtype="combobox" labelid caption="combobox" operation="NONE" ibiformat
datatype="0" addalloption="1" dynalldisplayvalue="ALL" inchainindex="-1" chainnumber="-1"
cacheruntimedata="0" displayfield numofrecords="-1" datafield sourcetype="typeMast"
datasource="car.mas" IBIC_server IBIAPP_app="anthony" datafieldtype="CHAR">
<OPTION value=none>Select a Report</OPTION>
<OPTION value=Country>Country</OPTION>
<OPTION value=Car>Car</OPTION>
<OPTION value=Model>Model</OPTION>
</SELECT>
<SELECT id=ITEM2 style="visibility:visible; Z-INDEX: 2; LEFT: 50px; WIDTH: 150px;
POSITION: absolute; TOP: 65px; HEIGHT: 22px" name ="Country" elementname="combobox2"
elementtype="combobox" labelid caption="combobox" operation="NONE" ibiformat datatype="1"
addalloption="1" dynalldisplayvalue="ALL" inchainindex="-1" chainnumber="-1" cacheruntimedata="0"
displayfield numofrecords="-1" datafield sourcetype="typeFex" datasource="selctry1.fex"
IBIC_server IBIAPP_app="anthony" datafieldtype="CHAR">
</SELECT>
<SELECT id=ITEM3 style="visibility:visible; Z-INDEX: 3; LEFT: 50px; WIDTH: 150px;
POSITION: absolute; TOP: 105px; HEIGHT: 22px" name ="Car" elementname="combobox3"
elementtype="combobox" labelid caption="combobox" operation="NONE" ibiformat datatype="1"
addalloption="1" dynalldisplayvalue="ALL" inchainindex="-1" chainnumber="-1" cacheruntimedata="0"
displayfield numofrecords="-1" datafield sourcetype="typeFex" datasource="selctry2.fex"
IBIC_server IBIAPP_app="anthony" datafieldtype="CHAR">
</SELECT>
<SELECT id=ITEM4 style="visibility:visible; Z-INDEX: 4; LEFT: 50px; WIDTH: 150px;
POSITION: absolute; TOP: 145px; HEIGHT: 22px" name ="Model" elementname="combobox4"
elementtype="combobox" labelid caption="combobox" operation="NONE" ibiformat datatype="1"
addalloption="1" dynalldisplayvalue="ALL" inchainindex="-1" chainnumber="-1" cacheruntimedata="0"
displayfield numofrecords="-1" datafield sourcetype="typeFex" datasource="selctry3.fex"
IBIC_server IBIAPP_app="anthony" datafieldtype="CHAR">
</SELECT>
<INPUT id=ITEM5 style="Z-INDEX: 5; LEFT: 50px; WIDTH: 80px; POSITION: absolute; TOP: 185px;
HEIGHT: 30px" type=submit value=Submit name ="button5" elementname="button5" elementtype="button"
sourcetype="typeUrl" targetname targettype="0" onclickset="0">
<INPUT id=ITEM6 style="Z-INDEX: 6; LEFT: 140px; WIDTH: 80px; POSITION: absolute; TOP: 185px;
HEIGHT: 30px" type=reset value=Reset name ="button6" elementname="button6" elementtype="button"
sourcetype="typeUrl" targetname targettype="0" onclickset="0">
</FORM>
<SCRIPT type=text/javascript>
<!--
function checkctrl() {
this.selected = document.getElementById("ITEM1");
//alert(this.selected.value);
selectCol = document.getElementsByTagName("SELECT");
for(i=0; i<selectCol.length; i++)
{
var el = selectCol[i];
var datatype = el.getAttribute("datatype");
if (datatype=="1")
{
if (el.name==this.selected.value)
{
// alert("Showing " + el.name);
// el.style.visibility = "visible";
el.disabled = 0;
} else {
// alert("Hiding " + el.name);
// el.style.visibility = "hidden";
el.disabled = 1;
}
}
}
}
//-->
</SCRIPT>
<!--endibiitems-->
<SCRIPT id=OnloadHandler>
function OnLoad() {
<!--startibilines-->
UpdateData();
<!--endibilines-->
}
</SCRIPT>
</BODY>
</HTML>
| |||||||||
|
| Silver Member |
Thanks Tony for the code. In testing the code, when I select Country in the top combobox, it makes the second box active and greys out the remaining boxes as intended, but I was hoping to display a list of countries in that second box. The other selections from the first box make the appropriate box active and the other grey. How would I work the display of appropriate values into the code. I triend uncommenting one of the el.style.visibility = "visible"; statements, but it had no effect | |||
|
| Expert |
If you have a look at the HTML you will see that the combo boxes are populated by fexes, selctry1, 2 and 3. These are fexes that I've used before and should be able to be found in the Forum somewhere. But basically they are TABLE FILE CAR SUM FST.COUNTRY BY COUNTRY ON TABLE PCHOLD FORMAT XML ENDwith the appropriate fields for selctry2 and 3 for CAR and MODEL respectively. You will need to ensure that the value for IBIAPP_app is set to something other than "anthony" to match where you place your fexes. If you intend to chain the combo boxes then, as I have said (and rather than repeat the code ), there is a post out there somewhere with my name on it that provides an example. Actually, there are loads of posts regarding chaining of combo boxes, come to think of it .The main intention with this post was to give you a basic example to be built upon because every application is different, of course. The el.style.visibility code can be inter-changed with the el.disabled to actually hide the combo boxes from view instead of disabling them. T Edited to correct the HOLD to PCHOLD   This message has been edited. Last edited by: Tony A,
| |||||||||
|
| Silver Member |
Tony, So what you're saying is that if I supply a selctry1, selctry2 and selctry3 fexes, which I've done with your example code, I should be able to populate the combo boxes. I realize I must change the IBIAPP_app from "anthony" to another folder identitied under apps, which I done. I've tried reexecuting it with the changes you suggest without changing the results. | |||
|
| Expert |
Hi, The fexes should run OK and populate the combo boxes with what you have done. Try running the selctry1 etc. to see the output. You should get an XML document that looks like this (hopefully this will look OK - unless someone edits it ) <?xml version="1.0" encoding="ISO-8859-1" ?> - <fxf version="1.0" data="hold"> - <report records="5" lines="5" columns="2" rows="5"> <target format="" version="" type="" destination="HOLD" /> - <column_desc> <col colnum="c0" fieldname="COUNTRY" alias="COUNTRY" datatype="char" width="10" focus_format="A10" description="Country of Origin" accept="" help_message="" title="Country of Origin" within="" property="" reference="" valign="left" /> <col colnum="c1" fieldname="COUNTRY" alias="COUNTRY" datatype="char" width="10" focus_format="A10" description="Country of Origin" accept="" help_message="" title="Country of Origin" within="" property="" reference="" valign="left" /> </column_desc> - <table> - <tr linetype="data" linenum="1"> <td colnum="c0">ENGLAND</td> <td colnum="c1">ENGLAND</td> </tr> - <tr linetype="data" linenum="2"> <td colnum="c0">FRANCE</td> <td colnum="c1">FRANCE</td> </tr> - <tr linetype="data" linenum="3"> <td colnum="c0">ITALY</td> <td colnum="c1">ITALY</td> </tr> - <tr linetype="data" linenum="4"> <td colnum="c0">JAPAN</td> <td colnum="c1">JAPAN</td> </tr> - <tr linetype="data" linenum="5"> <td colnum="c0">W GERMANY</td> <td colnum="c1">W GERMANY</td> </tr> </table> </report> </fxf>The other fexes should produce similar output relative to their fields and values. If you do not get output like this then there is something wrong with your fex. If you do get the same results then there is something wrong in your setup and you might need to supply a value for IBIC_server. Otherwise it should work fine. Good luck T
| |||||||||
|
| Silver Member |
Here are my three fexes: -*new SELCTRY1 TABLE FILE CAR SUM FST.COUNTRY BY COUNTRY ON TABLE HOLD FORMAT XML END -*new SELCTRY2 TABLE FILE CAR SUM FST.CAR BY CAR ON TABLE HOLD FORMAT XML END -*new SELCTRY3 TABLE FILE CAR SUM FST.MODEL BY MODEL ON TABLE HOLD FORMAT XML END I get 5 records from selctry1, 10 from selctry2 and 18 from selctry3. I don't know how this simple code, you offered as an example in your previous post, could produce what you suggest in your last post. You said "These are fexes that I've used before and should be able to be found in the Forum somewhere." Can you give me a hint as to where I might find them cause I've had no luck? | |||
|
| Silver Member |
Here is the code you provided: < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"> <script id=IbiOptionsScript type=text/javascript> var cgipath = "cgipath"; var ibirls = "ibirls"; var multidrill = "multidrill"; var mntFormValidate = "mntFormValidate"; var dyncalendar = "dyncalendar"; var ibiOptions = new Array(cgipath,ibirls,mntFormValidate,multidrill); <script id=nls src="/ibi_html/javaassist/nls.js" type=text/javascript> <script id=ibigbl src="/ibi_html/javaassist/ibi/html/js/ibigbl.js" type=text/javascript> <script id=ibigblloadCss type=text/javascript> ibigblloadCss(null); < !--startibiitems--> <script type=text/javascript> < !-- function checkctrl() { this.selected = document.getElementById("ITEM1"); //alert(this.selected.value); selectCol = document.getElementsByTagName("SELECT"); for(i=0; i var el = selectCol[i]; var datatype = el.getAttribute("datatype"); if (datatype=="1") { if (el.name==this.selected.value) { // alert("Showing " + el.name); // el.style.visibility = "visible"; el.disabled = 0; } else { // alert("Hiding " + el.name); // el.style.visibility = "hidden"; el.disabled = 1; } } } } //--> < !--endibiitems--> <script id=OnloadHandler> function OnLoad() { < !--startibilines--> UpdateData(); < !--endibilines--> } | |||
|
| Silver Member |
Sorry about that. When I pasted the code in the last post, something went wrong. Here it is again. I'm executing it as an .htm component. I've also executed it as a .fex with -HTMLPAGE BEGIN and END ---------------------------------------------- <script id=IbiOptionsScript type=text/javascript> var cgipath = "cgipath"; var ibirls = "ibirls"; var multidrill = "multidrill"; var mntFormValidate = "mntFormValidate"; var dyncalendar = "dyncalendar"; var ibiOptions = new Array(cgipath,ibirls,mntFormValidate,multidrill); <script id=nls src="/ibi_html/javaassist/nls.js" type=text/javascript> <script id=ibigbl src="/ibi_html/javaassist/ibi/html/js/ibigbl.js" type=text/javascript> <script id=ibigblloadCss type=text/javascript> ibigblloadCss(null); < !--startibiitems--> <script type=text/javascript> < !-- function checkctrl() { this.selected = document.getElementById("ITEM1"); //alert(this.selected.value); selectCol = document.getElementsByTagName("SELECT"); for(i=0; i var el = selectCol[i]; var datatype = el.getAttribute("datatype"); if (datatype=="1") { if (el.name==this.selected.value) { // alert("Showing " + el.name); // el.style.visibility = "visible"; el.disabled = 0; } else { // alert("Hiding " + el.name); // el.style.visibility = "hidden"; el.disabled = 1; } } } } //--> < !--endibiitems--> <script id=OnloadHandler> function OnLoad() { < !--startibilines--> UpdateData(); < !--endibilines--> } | |||
|
| Silver Member |
Obviously, I'm having difficulty pasting the code into this Forum. The source does not mirror directly to what is shown on the Forum post | |||
|
| Expert |
Hi focuscon, To display the code properly, please wrap your code with (code) and (/code) (replace the () with []) at the beginning and at the end, respectively. Thanks, Kerry Kerry Zhan Focal Point Moderator Information Builders, Inc. | |||
|
| Expert |
Jerry, The fex code that you posted is almost correct and will produce the XML output as I have inserted above once you change the ON TABLE HOLD to ON TABLE PCHOLD. They have to be targetted at the client machine so that the JavaScript can pick up the XML output. If you don't use PCHOLD the output will only be available to the server and therefore the JavaScript will never receive it and will not show any items in your selects. I take it you are running from Windows using Dev Studio? T Edited to add - My apologies, but I did have HOLD and not PCHOLD in the sample above ... oops!This message has been edited. Last edited by: Tony A,
| |||||||||
|
| Silver Member |
Tony, That last change worked. Thanks very much for your patience. | |||
|
| Powered by Social Strata |
 | Please Wait. Your request is being processed... |
Read-Only TopicFocal Point Focal Point Forums WebFOCUS/FOCUS Forum on Focal Point Optionally disabling and greying out list boxes
Focal Point Forums WebFOCUS/FOCUS Forum on Focal Point Optionally disabling and greying out list boxesCopyright © 1996-2020 Information Builders
| View $GS_USERNAME's Public Profile |
| Add $GS_USERNAME to my Ignore List |
| View Recent Posts by $GS_USERNAME |
| Notify me of New Posts by $GS_USERNAME |