add extra columns with image after xml dat load
I want to add extra columns for edit and delete. I have the code to retrieve the dat from the xml file.
But need to add extra columns which have images edit & delete
I tried by implementing the code below, But failed.
Help me out with the exact code
But need to add extra columns which have images edit & delete
I tried by implementing the code below, But failed.
Help me out with the exact code
<html>
<head>
<title>ActiveWidgets Example</title>
<!-- ActiveWidgets stylesheet and scripts -->
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<STYLE>BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; PADDING-TOP: 0px
}
HTML {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; PADDING-TOP: 0px
}
</STYLE>
<link href="basic_files/aw.css" rel="stylesheet" type="text/css" ></link>
<script src="basic_files/aw.js"></script>
<STYLE>
.aw-grid-control {
BORDER-RIGHT: medium none;
BORDER-TOP: medium none;
MARGIN: 0px;
FONT: menu;
BORDER-LEFT: medium none;
WIDTH: 100%;
BORDER-BOTTOM: medium none;
HEIGHT: 100%;
}
.aw-row-selector {
TEXT-ALIGN: center
}
.aw-column-0 {
WIDTH: 80px
}
.aw-column-1 {
WIDTH: 200px
}
.aw-column-2 {
TEXT-ALIGN: right
}
.aw-column-3 {
TEXT-ALIGN: right
}
.aw-column-4 {
TEXT-ALIGN: right
}
.aw-column-5 {
TEXT-ALIGN: center
}
.aw-column-6 {
TEXT-ALIGN: center
}
.aw-grid-row {
BORDER-BOTTOM: threedlightshadow 1px solid
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
}
.aw-alternate-even {
BACKGROUND-COLOR: #ECECE4
}
.aw-header-0 .aw-item-box
{
font-size: 9pt;
font-weight: normal;
text-align : center;
color: #000000;
background: #CCCCCC;
border-left: 1px solid ThreeDHighlight;
}
.aw-rows-selected { background: #B4B4DB; color: black; }
.aw-grid-cell {border-left: 1px solid ThreeDHighlight;}
.aw-row-selector{background:#ffffff; text-align: left;}
.aw-alternate-even .aw-row-selector .aw-item-box {
background: #ECECE4;
}
.aw-rows-selected .aw-row-selector .aw-item-box {
background: #B4B4DB;
}
.aw-row{
font-family: Arial, Helvetica, sans-serif;
font-size: 20pt;
}
.aw-header-0 .aw-grid-sort {
display:-moz-inline-box;
top:-2px
}
.aw-sort-ascending .aw-grid-sort {
background:url(grid.png) -25px -5px
}
.aw-sort-descending .aw-grid-sort {
background:url(grid.png) -45px -5px
}
.aw-header-0 .aw-mouseover-header {
BACKGROUND: #cccccc; BORDER-BOTTOM-COLOR: #f9b119
}
.aw-header-0 .aw-mouseover-header .aw-item-box {
BACKGROUND: #cccccc; BORDER-BOTTOM-COLOR: #f9a900
}
</STYLE>
<!-- grid data -->
<SCRIPT>
var myColumns = [
"Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees", "Edit", "Delete"
];
</SCRIPT>
<META content="MSHTML 6.00.2900.2802" name=GENERATOR>
</head>
<body>
<div id="1" style="width:930px;height:200px;overflow:auto">
<script>
var table = new AW.XML.Table;
table.setURL("companies-simple.xml");
table.request();
var obj = new AW.Grid.Extended;
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
obj.setCellModel(table);
obj.setRowCount(20);
obj.setColumnCount(7);
obj.setCellFormat([str, str, num, num, num]);
// provide cells and headers text
//obj.setCellText(myData);
obj.setHeaderText(myColumns);
// set number of rows/columns
// enable row selectors
obj.setSelectorVisible(true);
obj.setSelectorText(function(i){return this.getRowPosition(i)+1});
// set headers width/height
obj.setSelectorWidth(28);
obj.setHeaderHeight(20);
obj.setCellEditable(false);
obj.setFixedLeft(1);
obj.setVirtualMode(false);
obj.setSelectionMode("single-row");
//obj.setCellLink(function(i, j){ return "http://www.mysite.com?i="+i+"&j="+j; }, 5); // set data
//obj.setCellTemplate(new AW.Templates.Link, 5); // and template
//obj.setCellLink(function(i, j){ return "http://www.mysite.com?i="+i+"&j="+j; }, 6); // set data
//obj.setCellTemplate(new AW.Templates.Link, 6); // and template
for (var i=0; i<obj.getRowCount(); i++)
{
obj.setCellText("<img src='editicon.gif' BORDER='0'>", 5, i);
obj.setCellTooltip("Edit",5,i);
obj.setCellText("<img src='delicon.gif' BORDER='0'>", 6, i);
obj.setCellTooltip("Delete",6,i);
}
document.write(obj);
obj.setSelectedRows([5]);
obj.setCurrentRow(5-4); // -4 = rownumber of the selected row when autoscroll
</script>
</body>
</html>SS
April 25,