Styles for Dummies
Hey all,
This will be boring for 99% of you but as a newbie I would have found this helpful ;)
Throughout this forum you will see help given where they say something like "you just need to put '.aw-grid-cell {border-right: 1px solid threedlightshadow;}' in your 'style' ...." and you are thinking .. "Cool, what's a style..."
1) before the </head> section in your page, you can build a "style" like this ...
<!-- grid format -->
<style>
#Paid .aw-row-selector {text-align: center}
#Paid .aw-column-0 {text-align: left;}
#Paid .aw-column-1 {text-align: left;}
#Paid .aw-column-2 {text-align: center;}
#Paid .aw-column-3 {text-align: left;}
#Paid .aw-column-4 {text-align: left;}
#Paid .aw-grid-cell {border-right: 1px solid threedlightshadow;}
#Paid .aw-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
"#Paid" can be any name you like, the "#" is always there
Now when you see ref to these strange .aw-blah blah, you would add them here. If you have 2 or more grids on your page, just copy and paste and give it a new name.
The last part to make this work you do step 2.
2) Down where you create your grid or object ...
// create grid control
var obj = new AW.Grid.Extended;
// var obj = new AW.UI.Grid;
follow it with a line like this ....
obj.setId("Paid"); where "Paid" is the same name you used in step 1.
This is the ONLY place you will use that name. The "obj" or what ever your var above is, will still be used as always ...
So you still refer to the grid like this ..
obj.setColumnCount(myHeaders.length);
NOT
Paid.setColumnCount(myHeaders.length);
It really is that simple but it was clear as mud until I muddled through it.
Part of my confusion was I also use DIV ID which can look similar enough to screw you up. :)
This will be boring for 99% of you but as a newbie I would have found this helpful ;)
Throughout this forum you will see help given where they say something like "you just need to put '.aw-grid-cell {border-right: 1px solid threedlightshadow;}' in your 'style' ...." and you are thinking .. "Cool, what's a style..."
1) before the </head> section in your page, you can build a "style" like this ...
<!-- grid format -->
<style>
#Paid .aw-row-selector {text-align: center}
#Paid .aw-column-0 {text-align: left;}
#Paid .aw-column-1 {text-align: left;}
#Paid .aw-column-2 {text-align: center;}
#Paid .aw-column-3 {text-align: left;}
#Paid .aw-column-4 {text-align: left;}
#Paid .aw-grid-cell {border-right: 1px solid threedlightshadow;}
#Paid .aw-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
"#Paid" can be any name you like, the "#" is always there
Now when you see ref to these strange .aw-blah blah, you would add them here. If you have 2 or more grids on your page, just copy and paste and give it a new name.
The last part to make this work you do step 2.
2) Down where you create your grid or object ...
// create grid control
var obj = new AW.Grid.Extended;
// var obj = new AW.UI.Grid;
follow it with a line like this ....
obj.setId("Paid"); where "Paid" is the same name you used in step 1.
This is the ONLY place you will use that name. The "obj" or what ever your var above is, will still be used as always ...
So you still refer to the grid like this ..
obj.setColumnCount(myHeaders.length);
NOT
Paid.setColumnCount(myHeaders.length);
It really is that simple but it was clear as mud until I muddled through it.
Part of my confusion was I also use DIV ID which can look similar enough to screw you up. :)
SunBum
September 19,