Focal Point Banner


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
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

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  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     Data Grid in HTML with JS or so???

Read-Only Read-Only Topic
Go
Search
Notify
Tools
Data Grid in HTML with JS or so???
 Login/Join
 
Platinum Member
posted
Hello,
my new task is to build a datagrid (without Maintain) where the user can add values(int), and if nesseray
collapse a new row to add content. the last row has to build the sum of the added values(int).
The grid will have 3 columns and max. 8 rows.


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
I believe that you are looking for something like this Christian

 TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE COL1/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL1" id="R8C1" />'  ELSE 
'<input type="text" name="COL1" id="R'||EDIT(ROWCNT)||'C1" onChange="addIt();" />'; AS ''
COMPUTE COL2/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL2" id="R8C2" />'  ELSE 
'<input type="text" name="COL2" id="R'||EDIT(ROWCNT)||'C2" onChange="addIt();" />'; AS ''
COMPUTE COL3/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL3" id="R8C3" />'  ELSE 
'<input type="text" name="COL3" id="R'||EDIT(ROWCNT)||'C3" onChange="addIt();" />'; AS ''
COMPUTE BTN/A200=  IF ROWCNT GE 7 THEN ''  ELSE 
'<input type=button value="+/-" onClick="showHide('||EDIT(ROWCNT)||');"</input>'; AS ''

BY MODEL NOPRINT

WHERE RECORDLIMIT EQ 8
ON TABLE HOLD AS DATAGRID FORMAT HTMTABLE
ON TABLE SET PAGE NOLEAD
END
-RUN
-HTMLFORM BEGIN
<html>
<head>
<script javascript>
function initialHide(){
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');

for ( i=1; i<7;i++) {
  rows[i].style.display='none';
}
}

function showHide(onRow){
var doFrom = onRow;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;

if (nextStyle != 'none'){
for ( i=doFrom; i<7;i++) {
  rows[i].style.display='none';
  }
}
else 
  rows[doFrom].style.display='';
}

function addIt(){
document.getElementById("R8C1").value = (document.getElementById("R1C1").value -0) 
                                      + (document.getElementById("R2C1").value -0) 
                                      + (document.getElementById("R3C1").value -0) 
                                      + (document.getElementById("R4C1").value -0) 
                                      + (document.getElementById("R5C1").value -0) 
                                      + (document.getElementById("R6C1").value -0) 
                                      + (document.getElementById("R7C1").value -0) ;
document.getElementById("R8C2").value = (document.getElementById("R1C2").value -0) 
                                      + (document.getElementById("R2C2").value -0) 
                                      + (document.getElementById("R3C2").value -0) 
                                      + (document.getElementById("R4C2").value -0) 
                                      + (document.getElementById("R5C2").value -0) 
                                      + (document.getElementById("R6C2").value -0) 
                                      + (document.getElementById("R7C2").value -0) ;
document.getElementById("R8C3").value = (document.getElementById("R1C3").value -0) 
                                      + (document.getElementById("R2C3").value -0) 
                                      + (document.getElementById("R3C3").value -0) 
                                      + (document.getElementById("R4C3").value -0) 
                                      + (document.getElementById("R5C3").value -0) 
                                      + (document.getElementById("R6C3").value -0) 
                                      + (document.getElementById("R7C3").value -0) ;

}
</script>

</head>
<body onLoad="initialHide();">
!IBI.FIL.DATAGRID;
</body>
</html>
-HTMLFORM END

 

This message has been edited. Last edited by: <JG>,
 
Report This Post
Master
posted Hide Post
Holy Crap, that's awesome JG. I took the initial request to say he wanted to write it back to the table (i.e. the Maintain reference). I'm not seeing any MODIFYs or servelet calls so I'm assuming yours does not.

What would that piece look like (for my own knowledge)?

- ABT


------------------------------------
WF Environment:
------------------------------------
Server/Client, ReportCaster, Dev Studio: 7.6.11
Resource Analyzer, Resource Governor, Library, Maintain, InfoAssist
OS: Windows Server 2003
Application/Web Server: Tomcat 5.5.25
Java: JDK 1.6.0_03
Authentication: LDAP, MRREALM Driver
Output: PDF, EXL2K, HTM

------------------------------------
Databases:
------------------------------------
Oracle 10g
DB2 (AS/400)
MSSQL Server 2005
Access/FoxPro
 
Posts: 561 | Registered: February 03, 2010Report This Post
Platinum Member
posted Hide Post
Hello JG,
that,s really great stuff!!!!!!
ABT is right, i need to write each value with a modify in a sql server 2005 table.

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
As a re-entrant focexec it would be something like this, Obviously if you are doing an operation on a data base you will also
neeed to pass the key value

you do that using


HREF= HREF + "&|MATCHKEY=!IBI.AMP.MATCHKEY;";

Where MATCHKEY is an & variable that you pass into the focexec initially.

This example is for MRE so you need to change HREF= HREF + "&|IBIMR_drill=X,mredomaine/mredomain.htm";
to match your own domain


 
-DEFAULTH &STARTAT='DATAGRID';
-DEFAULTH &MATCHKEY='XYZ'
-GOTO &STARTAT.EVAL
-DATAGRID
DEFINE  FILE CAR
LOADDATA/A200='<input type=button value="Load" onClick="doLoad();"></input>';
END
TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE COL1/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL1" id="R8C1" />'  ELSE 
                                        '<input type="text" name="COL1" id="R'||EDIT(ROWCNT)||'C1" onChange="addIt();" />'; AS ''
COMPUTE COL2/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL2" id="R8C2" />'  ELSE 
                                        '<input type="text" name="COL2" id="R'||EDIT(ROWCNT)||'C2" onChange="addIt();" />'; AS ''
COMPUTE COL3/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL3" id="R8C3" />'  ELSE 
                                        '<input type="text" name="COL3" id="R'||EDIT(ROWCNT)||'C3" onChange="addIt();" />'; AS ''
COMPUTE BTN/A200=  IF ROWCNT GE 7 THEN ''  ELSE 
                                       '<input type=button value="+/-" onClick="showHide('||EDIT(ROWCNT)||');"</input>'; AS ''
BY MODEL NOPRINT
ON TABLE SUBFOOT
"<LOADDATA"
WHERE RECORDLIMIT EQ 8
ON TABLE HOLD AS DATAGRID FORMAT HTMTABLE
ON TABLE SET PAGE NOLEAD
END
-RUN
-HTMLFORM BEGIN
<html>
<head>
<script javascript>
function initialHide(){
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');

for ( i=1; i<7;i++) {
  rows[i].style.display='none';
}
}

function showHide(onRow){
var doFrom = onRow;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;

if (nextStyle != 'none'){
for ( i=doFrom; i<7;i++) {
  rows[i].style.display='none';
  }
}
else
  rows[doFrom].style.display='';
}

function addIt(){
document.getElementById("R8C1").value = (document.getElementById("R1C1").value -0)
                                      + (document.getElementById("R2C1").value -0)
                                      + (document.getElementById("R3C1").value -0)
                                      + (document.getElementById("R4C1").value -0)
                                      + (document.getElementById("R5C1").value -0)
                                      + (document.getElementById("R6C1").value -0)
                                      + (document.getElementById("R7C1").value -0) ;
document.getElementById("R8C2").value = (document.getElementById("R1C2").value -0)
                                      + (document.getElementById("R2C2").value -0)
                                      + (document.getElementById("R3C2").value -0)
                                      + (document.getElementById("R4C2").value -0)
                                      + (document.getElementById("R5C2").value -0)
                                      + (document.getElementById("R6C2").value -0)
                                      + (document.getElementById("R7C2").value -0) ;
document.getElementById("R8C3").value = (document.getElementById("R1C3").value -0)
                                      + (document.getElementById("R2C3").value -0)
                                      + (document.getElementById("R3C3").value -0)
                                      + (document.getElementById("R4C3").value -0)
                                      + (document.getElementById("R5C3").value -0)
                                      + (document.getElementById("R6C3").value -0)
                                      + (document.getElementById("R7C3").value -0) ;

}
function doLoad(){
var value1=document.getElementById("R8C1").value;
var value2=document.getElementById("R8C2").value;
var value3=document.getElementById("R8C3").value;
HREF="/ibi_apps/WFServlet?";
HREF= HREF + "IBIF_webapp=/ibi_apps";
HREF= HREF + "&|IBIC_server=EDASERVE";
HREF= HREF + "&|IBIWF_msgviewer=OFF";
HREF= HREF + "&|IBIAPP_app=baseapp";
HREF= HREF + "&|IBIMR_drill=X,mredomaine/mredomain.htm";
HREF= HREF + "&|IBIF_ex=app/datagrid";
HREF= HREF + "&|CLICKED_ON=";
HREF= HREF + "&|MATCHKEY=!IBI.AMP.MATCHKEY;";
HREF= HREF + "&|VALUE1="+value1;
HREF= HREF + "&|VALUE2="+value2;
HREF= HREF + "&|VALUE3="+value3;
HREF= HREF + "&|STARTAT=LOADDATA";
HREF= HREF + "&|Random="+(Math.random()); 
window.open(HREF,'dataload','menubar=1,resizable=1,width=800,height=500');
}
</script>

</head>
<body onLoad="initialHide();">
!IBI.FIL.DATAGRID;
</body>
</html>
-HTMLFORM END
-RUN
-EXIT
-LOADDATA
MODIFY FILE whatever
FIXFORM Statements
MATCH Statements
ON MATCH Statements
ON NOMATCH Statements
DATA
&MATCHKEY.EVAL,&VALUE1.EVAL,&VALUE2.EVAL,&VALUE3.EVAL
END

 


edit so that you do not have to scroll to view.

This message has been edited. Last edited by: <JG>,
 
Report This Post
<JG>
posted
Had a thought. Perhaps you would like to pre-populate the grid

-* File datagrid.fex
-DEFAULTH &STARTAT='DATAGRID';
-DEFAULTH &MATCHKEY='XYZ'
-GOTO &STARTAT.EVAL
-DATAGRID
DEFINE  FILE CAR
LOADDATA/A200='<input type=button value="Load" onClick="doLoad();"></input>';
END
TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE COL1/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL1" id="R8C1" />'  ELSE 
'<input type="text" name="COL1" value='||FTOA(DCOST, '(D7c)', 'A10')||' id="R'||EDIT(ROWCNT)||'C1" onChange="addIt();" />'; AS ''
COMPUTE COL2/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL2" id="R8C2" />'  ELSE 
'<input type="text" name="COL2" value='||FTOA(RCOST, '(D7c)', 'A10')||' id="R'||EDIT(ROWCNT)||'C2" onChange="addIt();" />'; AS ''
COMPUTE COL3/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL3" id="R8C3" />'  ELSE 
'<input type="text" name="COL3" value='||FTOA(SEATS, '(D7c)', 'A10')||' id="R'||EDIT(ROWCNT)||'C3" onChange="addIt();" />'; AS ''
COMPUTE BTN/A200=  IF ROWCNT GE 7 THEN ''  ELSE 
'<input type=button value="+/-" onClick="showHide('||EDIT(ROWCNT)||');"</input>'; AS ''
BY MODEL NOPRINT
ON TABLE SUBFOOT
"<LOADDATA &|copy; FOCALPOINT"
WHERE RECORDLIMIT EQ 8
ON TABLE HOLD AS DATAGRID FORMAT HTMTABLE
ON TABLE SET PAGE NOLEAD
END
-RUN
-HTMLFORM BEGIN
<html>
<head>
<script javascript>
function initialHide(){
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');

for ( i=1; i<7;i++) {
  rows[i].style.display='none';
}
addIt();
}

function showHide(onRow){
var doFrom = onRow;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;

if (nextStyle != 'none'){
for ( i=doFrom; i<7;i++) {
  rows[i].style.display='none';
  }
}
else
  rows[doFrom].style.display='';
}

function addIt(){
document.getElementById("R8C1").value = (document.getElementById("R1C1").value -0)
                                      + (document.getElementById("R2C1").value -0)
                                      + (document.getElementById("R3C1").value -0)
                                      + (document.getElementById("R4C1").value -0)
                                      + (document.getElementById("R5C1").value -0)
                                      + (document.getElementById("R6C1").value -0)
                                      + (document.getElementById("R7C1").value -0) ;
document.getElementById("R8C2").value = (document.getElementById("R1C2").value -0)
                                      + (document.getElementById("R2C2").value -0)
                                      + (document.getElementById("R3C2").value -0)
                                      + (document.getElementById("R4C2").value -0)
                                      + (document.getElementById("R5C2").value -0)
                                      + (document.getElementById("R6C2").value -0)
                                      + (document.getElementById("R7C2").value -0) ;
document.getElementById("R8C3").value = (document.getElementById("R1C3").value -0)
                                      + (document.getElementById("R2C3").value -0)
                                      + (document.getElementById("R3C3").value -0)
                                      + (document.getElementById("R4C3").value -0)
                                      + (document.getElementById("R5C3").value -0)
                                      + (document.getElementById("R6C3").value -0)
                                      + (document.getElementById("R7C3").value -0) ;

}
function doLoad(){
var value1=document.getElementById("R8C1").value;
var value2=document.getElementById("R8C2").value;
var value3=document.getElementById("R8C3").value;
HREF="/ibi_apps/WFServlet?";
HREF= HREF + "IBIF_webapp=/ibi_apps";
HREF= HREF + "&|IBIC_server=EDASERVE";
HREF= HREF + "&|IBIWF_msgviewer=OFF";
HREF= HREF + "&|IBIAPP_app=baseapp";
HREF= HREF + "&|IBIMR_drill=X,mredomaine/mredomain.htm";
HREF= HREF + "&|IBIF_ex=app/datagrid";
HREF= HREF + "&|CLICKED_ON=";
HREF= HREF + "&|MATCHKEY=!IBI.AMP.MATCHKEY;";
HREF= HREF + "&|VALUE1="+value1;
HREF= HREF + "&|VALUE2="+value2;
HREF= HREF + "&|VALUE3="+value3;
HREF= HREF + "&|STARTAT=LOADDATA";
HREF= HREF + "&|Random="+(Math.random()); 
window.open(HREF,'dataload','menubar=1,resizable=1,width=800,height=500');
}
</script>

</head>
<body onLoad="initialHide();">
!IBI.FIL.DATAGRID;
</body>
</html>
-HTMLFORM END
-RUN
-EXIT
-LOADDATA
MODIFY FILE whatever
FIXFORM Statements
MATCH Statements
ON MATCH Statements
ON NOMATCH Statements
DATA
&MATCHKEY.EVAL,&VALUE1.EVAL,&VALUE2.EVAL,&VALUE3.EVAL
END
  
 
Report This Post
Master
posted Hide Post
ABT files away 're-entrant focexec'. This is very, very cool and seems like you just had it laying around (or are a heck of a fast coder).

- ABT

Nice Thread


------------------------------------
WF Environment:
------------------------------------
Server/Client, ReportCaster, Dev Studio: 7.6.11
Resource Analyzer, Resource Governor, Library, Maintain, InfoAssist
OS: Windows Server 2003
Application/Web Server: Tomcat 5.5.25
Java: JDK 1.6.0_03
Authentication: LDAP, MRREALM Driver
Output: PDF, EXL2K, HTM

------------------------------------
Databases:
------------------------------------
Oracle 10g
DB2 (AS/400)
MSSQL Server 2005
Access/FoxPro
 
Posts: 561 | Registered: February 03, 2010Report This Post
<JG>
posted
25 years+ working with FOCUS/WebFOCUS.

Written from scratch, based on remembering all the issues I’ve had to accommodate over the years.

"Fast" yes WebFOCUS is fast when you understand it. Training and most important, experiance are the keys.

I might have chosen another word for "issues" but the spam filter would have * it.

There are still a lot of us "old" guys&gals out there.

Ask a question that is a challenge and get a solution.

Ask a question that is WF 101 course level and get ignored.

Sorry there is too much 101 going on at the moment.
 
Report This Post
<JG>
posted
Try doing something like this with any other BI tool.

I think not.
 
Report This Post
Platinum Member
posted Hide Post
HI JG,

thanks a lot so far!!! i am now working with WebFOCUS for 10 months and i am surprised every day about the possibilities. i will check out you code.
is it a problem to embed the grid in a normal form?? i think a have a another challenge!!!
is it also possible to implement a list box in the first cell of every row. so that the user can choose, for what kind of materials in my case, he fills out the grid.
the content of the list_box is always the same.

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
Christian, with a static select in the first column and using a standard form for submission.

 

-DEFAULTH &STARTAT='DATAGRID';
-DEFAULTH &MATCHKEY='XYZ'
-GOTO &STARTAT.EVAL
-DATAGRID
DEFINE  FILE CAR
LOADDATA/A200='<input type=submit value="Load" ></input>';
END
TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE COL1/A4000=  IF ROWCNT EQ 8 THEN ''  ELSE
'<SELECT id="R'||EDIT(ROWCNT)||'C1" name="R'||EDIT(ROWCNT)||'C1">'||
'<OPTION value=Value1 selected displaytext="Value1">Value1</OPTION>'|| 
'<OPTION value=Value2 displaytext="Value2">Value2</OPTION>'|| 
'<OPTION value=Value3 displaytext="Value3">Value3</OPTION>'|| 
'<OPTION value=Value4 displaytext="Value4">Value4</OPTION></SELECT>' ; AS ''
COMPUTE COL2/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL2" id="R8C2" />'  ELSE '<input type="text" name="R'||EDIT(ROWCNT)||'C2" id="R'||EDIT(ROWCNT)||'C2" onChange="addIt();" />'; AS ''
COMPUTE COL3/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL3" id="R8C3" />'  ELSE '<input type="text" name="R'||EDIT(ROWCNT)||'C3" id="R'||EDIT(ROWCNT)||'C3" onChange="addIt();" />'; AS ''
COMPUTE BTN/A200=  IF ROWCNT GE 7 THEN ''  ELSE '<input type=button value="+/-" onClick="showHide('||EDIT(ROWCNT)||');"</input>'; AS ''
BY MODEL NOPRINT
ON TABLE SUBFOOT
"<LOADDATA"
WHERE RECORDLIMIT EQ 8
ON TABLE HOLD AS DATAGRID FORMAT HTMTABLE
ON TABLE SET PAGE NOLEAD
END
-RUN
-HTMLFORM BEGIN
<html>
<head>
<script javascript>
function initialHide(){
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');

for ( i=1; i<7;i++) {
  rows[i].style.display='none';
}
}

function showHide(onRow){
var doFrom = onRow;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;

if (nextStyle != 'none'){
for ( i=doFrom; i<7;i++) {
  rows[i].style.display='none';
  }
}
else
  rows[doFrom].style.display='';
}

function addIt(){
//document.getElementById("R8C1").value = (document.getElementById("R1C1").value -0)
//                                      + (document.getElementById("R2C1").value -0)
//                                      + (document.getElementById("R3C1").value -0)
//                                      + (document.getElementById("R4C1").value -0)
//                                      + (document.getElementById("R5C1").value -0)
//                                      + (document.getElementById("R6C1").value -0)
//                                      + (document.getElementById("R7C1").value -0) ;
document.getElementById("R8C2").value = (document.getElementById("R1C2").value -0)
                                      + (document.getElementById("R2C2").value -0)
                                      + (document.getElementById("R3C2").value -0)
                                      + (document.getElementById("R4C2").value -0)
                                      + (document.getElementById("R5C2").value -0)
                                      + (document.getElementById("R6C2").value -0)
                                      + (document.getElementById("R7C2").value -0) ;
document.getElementById("R8C3").value = (document.getElementById("R1C3").value -0)
                                      + (document.getElementById("R2C3").value -0)
                                      + (document.getElementById("R3C3").value -0)
                                      + (document.getElementById("R4C3").value -0)
                                      + (document.getElementById("R5C3").value -0)
                                      + (document.getElementById("R6C3").value -0)
                                      + (document.getElementById("R7C3").value -0) ;

}
</script>

</head>
<body onLoad="initialHide();">
<form name="datagrid" action="/ibi_apps/WFServlet?" method="POST">
<input type=hidden name=IBIF_webapp     id=IBIF_webapp     value="/ibi_apps"/>
<input type=hidden name=IBIC_server     id=IBIC_server     value="EDASERVE"/>
<input type=hidden name=IBIWF_msgviewer id=IBIWF_msgviewer value="OFF"/>
<input type=hidden name=IBIAPP_app      id=IBIAPP_app      value="baseapp"/>
<input type=hidden name=IBIMR_drill     id=IBIMR_drill     value="X,yourdomain/yourdomain.htm"/>
<input type=hidden name=IBIF_ex         id=IBIF_ex         value="app/datagrid"/>
<input type=hidden name=CLICKED_ON      id=CLICKED_ON      value=""/>
<input type=hidden name=STARTAT         id=STARTAT         value="LOADDATA"/>
<input type=hidden name=MATCHKEY        id=MATCHKEY        value="!IBI.AMP.MATCHKEY;"/>
!IBI.FIL.DATAGRID;
</form>
</body>
</html>
-HTMLFORM END
-RUN
-EXIT
-LOADDATA
-? &
 
 
Report This Post
Platinum Member
posted Hide Post
Hello JG,

thanks a lot again!! i did not really get it how i can implement the grid in a normal html
side, which a disigned with the html composer.

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
Christian,

The problem with the composer is that it does not allow you to insert a table.
Controlling the collapse/expand functionality is much easier using a table
than trying to do it on the code that the composer generates.

Although you could do it.
 
Report This Post
Platinum Member
posted Hide Post
JG,

i just ask because i have to add some normal text_boxes and some check_boxes to the form. i think
i can just add them by copying the code that the composer generates. i thought it would be the best to start with the difficult part of the form.


Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
To be honest if you are not very comfortable hand coding the html
your best option is to generate the code you need using a standard html designer
and copying and pasting form that.

The code generated by the composer is very dificult to manipulate.
 
Report This Post
Platinum Member
posted Hide Post
Okay, i will try it with another html designer!! Last question, how can i add headers to the columns, after i wrote something between the '', the symbol for +/- disapperas.

Thanks a lot again!! For the great stuff!!!

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
That's because you have added an extra row into the table by having AS 'column title'

All you need to do is change the counters in the JS

it should now look like this

 for ( i=2; i<8;i++) {
  rows[i].style.display='none';
}
}

function showHide(onRow){
var doFrom = onRow +1;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;
alert(nextStyle);
if (nextStyle != 'none'){
for ( i=doFrom; i<8;i++) {
  rows[i].style.display='none';
  }
}
else
  rows[doFrom].style.display='';
} 


Remember if you add additional rows above the table you will have to adjust it
 
Report This Post
Platinum Member
posted Hide Post
Hello JG,

just one short question bevor the weekend beginns, how can i implement a dynamic list in the first column. Thank you and nice weekend to everyone!!!

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
<JG>
posted
like this

 -DEFAULTH &STARTAT='DATAGRID';
-DEFAULTH &MATCHKEY='XYZ'
-GOTO &STARTAT.EVAL
-DATAGRID
TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE SELECTED/A10= IF ROWCNT EQ 1 THEN ' selected' ELSE ' '; NOPRINT
COMPUTE FOOT/A200='''</SELECT>'';' ; NOPRINT
COMPUTE SELECT/A200='''<OPTION value="' ||CAR|| '"' || SELECTED || ' displaytext="'||CAR|| '">'||CAR|| '</OPTION> '' ||'; AS ''
ON TABLE SUBFOOT
"<ST.FOOT AS ''"
ON TABLE SET HOLDLIST PRINTONLY
ON TABLE SET PAGE NOLEAD
ON TABLE SAVE AS SELECTLIST FORMAT WP
END
-RUN

DEFINE  FILE CAR
LOADDATA/A200='<input type=submit value="Load" ></input>';
END
TABLE FILE CAR
PRINT
COMPUTE ROWCNT/I1= LAST ROWCNT + 1; NOPRINT
COMPUTE COL1/A4000=  IF ROWCNT EQ 8 THEN ''  ELSE
'<SELECT id="R'||EDIT(ROWCNT)||'C1" name="R'||EDIT(ROWCNT)||'C1">'||
-MRNOEDIT -INCLUDE SELECTLIST
COMPUTE COL2/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL2" id="R8C2" />'  ELSE '<input type="text" name="R'||EDIT(ROWCNT)||'C2" id="R'||EDIT(ROWCNT)||'C2" onChange="addIt();" />'; AS 'Col1'
COMPUTE COL3/A200= IF ROWCNT EQ 8 THEN  '<input type="text" name="COL3" id="R8C3" />'  ELSE '<input type="text" name="R'||EDIT(ROWCNT)||'C3" id="R'||EDIT(ROWCNT)||'C3" onChange="addIt();" />'; AS 'Col2'
COMPUTE BTN/A200=  IF ROWCNT GE 7 THEN ''  ELSE '<input type=button value="+/-" onClick="showHide('||EDIT(ROWCNT)||');"</input>'; AS ''
BY MODEL NOPRINT
ON TABLE SUBFOOT
"<LOADDATA"
WHERE RECORDLIMIT EQ 8
ON TABLE HOLD AS DATAGRID FORMAT HTMTABLE
ON TABLE SET PAGE NOLEAD
END
-RUN
-HTMLFORM BEGIN
<html>
<head>
<script javascript>
function initialHide(){
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');

for ( i=2; i<8;i++) {
  rows[i].style.display='none';
}
}

function showHide(onRow){
var doFrom = onRow + 1;
var tbl  = document.getElementsByTagName('TABLE');
var rows = document.getElementsByTagName('TR');
var nextStyle=rows[doFrom].style.display;

if (nextStyle != 'none'){
for ( i=doFrom; i<8;i++) {
  rows[i].style.display='none';
  }
}
else
  rows[doFrom].style.display='';
}

function addIt(){
//document.getElementById("R8C1").value = (document.getElementById("R1C1").value -0)
//                                      + (document.getElementById("R2C1").value -0)
//                                      + (document.getElementById("R3C1").value -0)
//                                      + (document.getElementById("R4C1").value -0)
//                                      + (document.getElementById("R5C1").value -0)
//                                      + (document.getElementById("R6C1").value -0)
//                                      + (document.getElementById("R7C1").value -0) ;
document.getElementById("R8C2").value = (document.getElementById("R1C2").value -0)
                                      + (document.getElementById("R2C2").value -0)
                                      + (document.getElementById("R3C2").value -0)
                                      + (document.getElementById("R4C2").value -0)
                                      + (document.getElementById("R5C2").value -0)
                                      + (document.getElementById("R6C2").value -0)
                                      + (document.getElementById("R7C2").value -0) ;
document.getElementById("R8C3").value = (document.getElementById("R1C3").value -0)
                                      + (document.getElementById("R2C3").value -0)
                                      + (document.getElementById("R3C3").value -0)
                                      + (document.getElementById("R4C3").value -0)
                                      + (document.getElementById("R5C3").value -0)
                                      + (document.getElementById("R6C3").value -0)
                                      + (document.getElementById("R7C3").value -0) ;

}
</script>

</head>
<body onLoad="initialHide();">
<form name="datagrid" action="/ibi_apps/WFServlet?" method="POST">
<input type=hidden name=IBIF_webapp     id=IBIF_webapp     value="/ibi_apps"/>
<input type=hidden name=IBIC_server     id=IBIC_server     value="EDASERVE"/>
<input type=hidden name=IBIWF_msgviewer id=IBIWF_msgviewer value="OFF"/>
<input type=hidden name=IBIAPP_app      id=IBIAPP_app      value="baseapp"/>
<input type=hidden name=IBIMR_drill     id=IBIMR_drill     value="X,yourdomain/yourdomain.htm"/>
<input type=hidden name=IBIF_ex         id=IBIF_ex         value="app/datagrid"/>
<input type=hidden name=CLICKED_ON      id=CLICKED_ON      value=""/>
<input type=hidden name=STARTAT         id=STARTAT         value="LOADDATA"/>
<input type=hidden name=MATCHKEY        id=MATCHKEY        value="!IBI.AMP.MATCHKEY;"/>
!IBI.FIL.DATAGRID;
</form>
</body>
</html>
-HTMLFORM END
-RUN
-EXIT
-LOADDATA
-? &
 
 
Report This Post
Platinum Member
posted Hide Post
Hello JG,
thanks for the code. How can i implement an alpha file as an source for the list_field. i have reached the limit of the WP output format!!

Thanks a lot

Christian


WF Production Version: 7.7.02M
WF Test Version: 7.7.02M
Developer Studio: 7.7.02
HTML, EXL2K, FLEX, PDF,PPT
 
Posts: 156 | Location: Essen Germany | Registered: December 02, 2010Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     Data Grid in HTML with JS or so???

Copyright © 1996-2020 Information Builders