3.2.0
Forum Demo Guide API Store

No Data in Right-Most Columns

My grids do not display data in the right-most columns until the total width is about 140 pixels. For example:

column 1: width 200
column 2: width 100
column 3: width 50
column 4: width 50

Columns 3 and 4 will have the headings displayed, but no data values. If I set the width of column 4 to 150, then data values are displayed in columns 3 and 4. If I widen the columns via the grid itself (drag column heading border), data will be displayed once a width of about 150 is set.

I have this problem in IE and Firefox.
Brian Crandall
August 31,
What is the total width of the grid set to? Does it have a selector? What about the data?
Anthony
August 31,
Grid width is less than the sum of the columns. Yes, it has a selector. Data can be str, date, num; behavior is the same. I have many grids, just one acting this way. Even when data value is Y or N, nothing is displayed unless the width of the column is 150+. Only happens in right-most column(s). Code is not new, it was copied from existing grids that work correctly, so I figure it must be a problem with some size or column count, as the right-hand edge (border) of the last column is not displayed, either, but I cannot find an error.
Brian Crandall
September 1,
Brian,

could you post the code so we can reproduce this?
Alex (ActiveWidgets)
September 1,
Alex,

Here is the source, minus our page header and footer and some proprietary images:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>My Title</title>
<link href="My_Styles.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<style type="text/css">
<!--
.style1 {color: #FF0000}
-->
</style>
</head>

<body>

<script language="JavaScript1.2" type="text/JavaScript">

function setLocation(url){
document.location = url;
}
</script>



<script language="JavaScript" type="text/JavaScript" src="tooltip.js"></script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}

function ChangeDisplay(TargetURL){
window.location = TargetURL;
}
//-->
</script>


<style type="text/css">
.aw-quirks * {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

body {font: 12px Tahoma}
</style>


<script src="runtime/lib/aw.js" type="text/javascript"></script>
<link href="runtime/styles/classic/aw.css" rel="stylesheet">


<style type="text/css">
/* Table (grid) size. */
#myGrid {height: 400px; width: 950px}

/* make sure that all links are blue and remain blue. */
#myGrid a {color: #0000CC;}
#myGrid a:hover {color: #0000CC;}
#myGrid a:link {color: #0000CC;}
#myGrid a:visted {color: #0000CC;}

/* row and cell borders */
#myGrid .aw-grid-row {border-bottom: 1px solid #999999;}
#myGrid .aw-grid-cell {border-right: 1px solid #999999;}

#myGrid .aw-grid-footer {border-right: 1px solid #999999; border-top: 1px solid #999999;
background-color: #ccffcc;
padding-right: 3px; padding-right: 3px; padding-bottom: 1px; padding-top: 1px;
font-weight: bold;}

/* row selector (left-hand edge) */
/*#myGrid .aw-row-selector {text-align: center; width: 10px; background: #dcdee0;} */

/* alternate row cfolors */
#myGrid .aw-alternate-even {background: #ffffff;}
#myGrid .aw-alternate-odd {background: #f4f4f4;}

/* color of highlighted row(s) */
#myGrid .aw-rows-selected {background: #ade1ff!important; color:#000000!important;}


#myGrid .aw-column-0 {width: 70px; text-align: left ; }
#myGrid .aw-column-1 {width: 160px; text-align: left ; }
#myGrid .aw-column-2 {width: 50px; text-align: left ; }
#myGrid .aw-column-3 {width: 40px; text-align: left ; }
#myGrid .aw-column-4 {width: 40px; text-align: left ; }
#myGrid .aw-column-5 {width: 300px; text-align: left ; }
#myGrid .aw-column-6 {width: 25px; text-align: left ; }
#myGrid .aw-column-7 {width: 140px; text-align: left ; }
#myGrid .aw-column-8 {width: 200px; text-align: left ; }
#myGrid .aw-column-9 {width: 200px; text-align: left ; }
#myGrid .aw-column-10 {width: 200px; text-align: left ; }
#myGrid .aw-column-11 {width: 70px; text-align: left ; }
#myGrid .aw-column-12 {width: 100px; text-align: center ; }
#myGrid .aw-column-13 {width: 100px; text-align: right ; }
#myGrid .aw-column-14 {width: 200px; text-align: left ; }
#myGrid .aw-column-15 {width: 200px; text-align: left ; }
#myGrid .aw-column-16 {width: 200px; text-align: left ; }
#myGrid .aw-column-17 {width: 50px; text-align: left ; }
#myGrid .aw-column-18 {width: 400px; text-align: left ; }
#myGrid .aw-column-19 {width: 80px; text-align: center ; }
#myGrid .aw-column-20 {width: 70px; text-align: center ; }
#myGrid .aw-column-21 {width: 50px; text-align: center ; }

/* box model fix for strict doctypes, safari */
.aw-strict #myGrid .aw-grid-cell {padding-right: 3px;}
.aw-strict #myGrid .aw-grid-row {padding-bottom: 3px;}
</style>


<table border="1" cellpadding="1" cellspacing="2" bordercolor="#FFFFFF">
<tr>
<td width="900" class="BoldText12" align="center"> 3 Records Found </td>
</tr>

</table>


<script>
var myData = [];
</script>


<script>myData.push(["<a href=\"My_Cont_Data.cfm?sap_cont_no=40052613&site=ES&context1=UNB&context2=month\" title=\"Branch to Contract Data screen, with Unbilled Reasons/Amts\" onMouseOver=\"window.status=\'Branch to Contract Data screen, with Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">40052613&nbsp;</a>","167913","ZPPC","BU263","ES","1063: Customer 1","20","26302C: F15","26302C00: AESA","26302C0002: ANG","26302C000211: 2006","Z1S1LRPG","<a href=\'javascript:;\' title=\'Update PP Billing Complete\' onClick=\"MM_openBrWindow(\'My_Update_Cont_Data.cfm?sap_cont_no=40052613&site=ES\',\'\',\'menubar=yes,scrollbars=yes,width=550,height=450,left=10,top=10\')\" onMouseOver=\"window.status=\'Update PP Billing Complete\'; return true\" onMouseOut=\"window.status=\'\'; return true\">N</a>","<a href=\'javascript:;\' onClick=\"MM_openBrWindow(\'My_Add_Unbilled.cfm?sap_cont_no=40052613&proj_def=Z1S1LRPG&site=ES&profit_ctr=2630&period=month\', \'CWS2\',\'menubar=yes,resizable=yes,toolbar=no,scrollbars=yes,width=1200,height=700,left=10,top=10\')\" title=\'Input Unbilled Reasons/Amts\' onMouseOver=\"window.status=\'Input Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">$568,580.57</a>","<a href=\'javascript:;\' title=\'click to view full help text\' onClick=\"MM_openBrWindow(\'My_View_Prob_Ctgy.cfm?ctgy_id=307&site=ES\',\'\',\'menubar=yes,scrollbars=yes,resizable=yes,width=550,height=250,left=200,top=200\')\" onMouseOver=\"window.status=\'click to view full help text\'; return true\" onMouseOut=\"window.status=\'\'; return true\">Blank Bill Code</a>","Cost Actions","Low Hanging Fruit","Sched C"," ","<a href=\'javascript:;\' onClick=\"javascript:MM_openBrWindow(\'My_Add_Action_Item.cfm?sap_cont_no=40052613&proj_def=Z1S1LRPG&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" title=\'Create Action Item\' onMouseOver=\"window.status=\'Create Action Item\'; return true\" onMouseOut=\"window.status=\'\'; return true\">CREATE</a>","<a href=\'javascript:;\' title=\'Add Comment\' onClick=\"MM_openBrWindow(\'My_Add_Comment.cfm?sap_cont_no=40052613&proj_def=Z1S1LRPG&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" onMouseOver=\"window.status=\'Add Comment\'; return true\" onMouseOut=\"window.status=\'\'; return true\">ADD</a>"," 0","#ffffff",]);</script>


<script>myData.push(["<a href=\"My_Cont_Data.cfm?sap_cont_no=40056136&site=ES&context1=UNB&context2=month\" title=\"Branch to Contract Data screen, with Unbilled Reasons/Amts\" onMouseOver=\"window.status=\'Branch to Contract Data screen, with Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">40056136&nbsp;</a>","207869","ZCPC","BU263","ES","1704: THE Customer 1 COMPANY","20","26302D: F18","26302D02: F/A-18 APG-79 RADARS","NONE","NONE","Z1S1FADW","<a href=\'javascript:;\' title=\'Update PP Billing Complete\' onClick=\"MM_openBrWindow(\'My_Update_Cont_Data.cfm?sap_cont_no=40056136&site=ES\',\'\',\'menubar=yes,scrollbars=yes,width=550,height=450,left=10,top=10\')\" onMouseOver=\"window.status=\'Update PP Billing Complete\'; return true\" onMouseOut=\"window.status=\'\'; return true\">N</a>","<a href=\'javascript:;\' onClick=\"MM_openBrWindow(\'My_Add_Unbilled.cfm?sap_cont_no=40056136&proj_def=Z1S1FADW&site=ES&profit_ctr=2630&period=month\', \'CWS2\',\'menubar=yes,resizable=yes,toolbar=no,scrollbars=yes,width=1200,height=700,left=10,top=10\')\" title=\'Input Unbilled Reasons/Amts\' onMouseOver=\"window.status=\'Input Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">$30,486.66</a>","<a href=\'javascript:;\' title=\'click to view full help text\' onClick=\"MM_openBrWindow(\'My_View_Prob_Ctgy.cfm?ctgy_id=307&site=ES\',\'\',\'menubar=yes,scrollbars=yes,resizable=yes,width=550,height=250,left=200,top=200\')\" onMouseOver=\"window.status=\'click to view full help text\'; return true\" onMouseOut=\"window.status=\'\'; return true\">Blank Bill Code</a>","Cost Actions","Low Hanging Fruit","Sched C","<a href=\'javascript:;\' onmouseover=\"Tip(\'Bill code updated on 6/27/08 (last day of fiscal). Billing to be expected next cycle. LD 7/17/08.\', TITLE, \'Full Comment Text\', WIDTH, 500, BGCOLOR, \'#ffffcc\')\" onmouseout=\"UnTip()\">Bill code updated on 6/27/08 (last day of fiscal). Billing to be expected next cycle. LD 7/17/08.</a>","<a href=\'javascript:;\' onClick=\"javascript:MM_openBrWindow(\'My_Add_Action_Item.cfm?sap_cont_no=40056136&proj_def=Z1S1FADW&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" title=\'Create Action Item\' onMouseOver=\"window.status=\'Create Action Item\'; return true\" onMouseOut=\"window.status=\'\'; return true\">CREATE</a>","<a href=\'javascript:;\' title=\'Add Comment\' onClick=\"MM_openBrWindow(\'My_Add_Comment.cfm?sap_cont_no=40056136&proj_def=Z1S1FADW&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" onMouseOver=\"window.status=\'Add Comment\'; return true\" onMouseOut=\"window.status=\'\'; return true\">ADD</a>"," 0","#f4f4f4",]);</script>


<script>myData.push(["<a href=\"My_Cont_Data.cfm?sap_cont_no=40065209&site=ES&context1=UNB&context2=month\" title=\"Branch to Contract Data screen, with Unbilled Reasons/Amts\" onMouseOver=\"window.status=\'Branch to Contract Data screen, with Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">40065209&nbsp;</a>","203666","ZPPC","BU263","ES","1063: Customer 1","20","26302C: F15","26302C00: AESA","26302C0002: ANG","26302C000212: 2007","Z1S1A88Y","<a href=\'javascript:;\' title=\'Update PP Billing Complete\' onClick=\"MM_openBrWindow(\'My_Update_Cont_Data.cfm?sap_cont_no=40065209&site=ES\',\'\',\'menubar=yes,scrollbars=yes,width=550,height=450,left=10,top=10\')\" onMouseOver=\"window.status=\'Update PP Billing Complete\'; return true\" onMouseOut=\"window.status=\'\'; return true\">N</a>","<a href=\'javascript:;\' onClick=\"MM_openBrWindow(\'My_Add_Unbilled.cfm?sap_cont_no=40065209&proj_def=Z1S1A88Y&site=ES&profit_ctr=2630&period=month\', \'CWS2\',\'menubar=yes,resizable=yes,toolbar=no,scrollbars=yes,width=1200,height=700,left=10,top=10\')\" title=\'Input Unbilled Reasons/Amts\' onMouseOver=\"window.status=\'Input Unbilled Reasons/Amts\'; return true\" onMouseOut=\"window.status=\'\'; return true\">$3,604.64</a>","<a href=\'javascript:;\' title=\'click to view full help text\' onClick=\"MM_openBrWindow(\'My_View_Prob_Ctgy.cfm?ctgy_id=307&site=ES\',\'\',\'menubar=yes,scrollbars=yes,resizable=yes,width=550,height=250,left=200,top=200\')\" onMouseOver=\"window.status=\'click to view full help text\'; return true\" onMouseOut=\"window.status=\'\'; return true\">Blank Bill Code</a>","Cost Actions","Low Hanging Fruit","Sched C"," ","<a href=\'javascript:;\' onClick=\"javascript:MM_openBrWindow(\'My_Add_Action_Item.cfm?sap_cont_no=40065209&proj_def=Z1S1A88Y&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" title=\'Create Action Item\' onMouseOver=\"window.status=\'Create Action Item\'; return true\" onMouseOut=\"window.status=\'\'; return true\">CREATE</a>","<a href=\'javascript:;\' title=\'Add Comment\' onClick=\"MM_openBrWindow(\'My_Add_Comment.cfm?sap_cont_no=40065209&proj_def=Z1S1A88Y&site=ES&context=UNB&problem_category_id=307&problem_category_desc=Blank Bill Code\',\'\',\'menubar=yes,scrollbars=no,width=800,height=250,left=10,top=10\');\" onMouseOver=\"window.status=\'Add Comment\'; return true\" onMouseOut=\"window.status=\'\'; return true\">ADD</a>"," 0","#ffffff",]);</script>


<!-- insert control tag -->
<span id="myGrid"></span>

<!-- create controls -->
<script type="text/javascript">
// define column labels

var columns = ["SAP Cont No","P.O. No","Cont Type","Bus Unit","Bill Site","Customer","DC","Mjr Pgm","Sub Pgm 1","Sub Pgm 2","Sub Pgm 3","Proj Def","PP Billing Complete","Unbilled Amount","Problem Category","IFR Rollup Category","Cash Oppty Code","Rec Type","Latest Comment","New Action Item","New Comment","Open AIs"," "];

var grid = new AW.Grid.Extended;
grid.setId("myGrid");

// set fixed columns on the left side
grid.setFixedLeft(0);

// set fixed columns on the right side
grid.setFixedRight(0);

// set selection mode to multiple rows
grid.setSelectionMode("multi-row");


// set number of columns to display. there may be other columns in myData that we do not want
// to show (e.g. hyperlinks).
grid.setColumnCount(22);
// set number of rows to display


grid.setRowCount(3);
// provide column labels
grid.setHeaderText(columns);
// show row selectors


grid.setSelectorVisible(true);
grid.setSelectorWidth(30);
grid.setSelectorText(function(i){return this.getRowPosition(i)+1});
// Disable the browser right-click context menu (copy, paste, select, print)
grid.setEvent("oncontextmenu", "return false");
grid.setController("copypaste", {});
// Disable the browser right-click context menu (copy, paste, select, print)
grid.setEvent("oncontextmenu", "return false");
grid.setController("copypaste", {});
// Read the data from myData
grid.setCellText(myData);
// footer stiff
grid.setFooterVisible(true);
grid.setFooterText([["TOTAL","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","$602,671.87","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","&nbsp;","#ccffcc",],]);
grid.setFooterCount(1);
//
var num = new AW.Formats.Number;
var str = new AW.Formats.String;
var date = new AW.Formats.Date;
grid.setCellFormat([str,str,str,str,str,str,str,str,str,str,str,str,str,num,str,str,str,str,str,str,str,num]);
//
grid.refresh();
</script>


<br>

</body>
</html>
Brian Crandall
September 1,
This is actually a bug in AW grid. To fix it you need to replace (line 83, source/lib/grid/_virtual.js) -

for(i = k; i<columnCount; i++){

with

for(i = k+1; i<columnCount; i++){

This bug will be corrected in the next release.
Alex (ActiveWidgets)
September 21,
Fixed in AW 2.5.5 -
http://www.activewidgets.com/general.bugs/2-5-5.html
Alex (ActiveWidgets)
September 25,
Thanks, Alex. That did it.
Brian Crandall
October 6,

This topic is archived.

See also:

Search Grid Column For Match Joe (45)
Column Header DropdownBox Filter Example Required Andy (28)
Help?!-Posting cell data to new window? max freeman (17)
Hiding columns Kwooda (16)
Example - saving editable grid data to the server Alex (ActiveWidgets) (18)
Grid Header Column and Data rows column width do not match Ravindra Joshi (5)
grid data sometimes doesn't display after replacing data Jim D. (8)
How do you add an image to the first column in a grid? L. Aragon (17)
hide cell data Mark Wester - Holland (14)
Columns move to extreme left when resizing to right in Grid.Extended Francois Hensley (7)

Back to support forum

Search

New Data Grid
Angular Data Grid
React Data Grid
Vue Data Grid
Svelte Data Grid

Version 2

Looking for AW 2.6 ?
The old site is here.

ActiveWidgets is a javascript library for creating user interfaces. It offers excellent performance for complex screens while staying simple, compact and easy to learn. Deployed by thousands of commercial customers in more than 70 countries worldwide.

Copyright © ActiveWidgets 2021
Getting Started
 
Sample Code API Reference Support Forum Prices & Licensing
 
Contact Us