Complex HTML/Form In A Single Header Cell

Hi,

I have two header rows in an extended grid. The first row is the traditional header with labels for the columns.

For the second row, I'd like to implement what would basically be a small form inside each cell. Generally, it would be a textbox and a button, or a combobox and a button. The current set of templates is not enough. (BTW, why is there no AW.Templates.Button!?!)

The simply-stated goal is to create a place in each column's second header cell that a user can enter/select one or more values that can then be pushed into each data cell below it.

What are my options? My guess is either I shove in a bunch of HTML manually, but I'm not sure how to do that.

Or, I derive my own Template (AW.Template.Form1), but my guess is that is somewhat difficult?

Can anyone suggest either an answer to the two ideas I have, or other avenues to consider?

Thanks.

Paul
Check this post,
/javascript.forum.8138.6/this-is-old-topic-set.html

When you need to insert complex html into grid cell or header - use AW.Templates.Cell and put the html into cell text or header text property -

var obj = new AW.Grid.Extended;

    obj.setCellText("cell");
    obj.setHeaderText("header");
    obj.setColumnCount(10);
    obj.setRowCount(10);

    var formText = "<input style=\"width:30px\"></input>" +
        "<button>Click</button>";

    obj.setHeaderCount(2);
    obj.setHeaderTemplate(new AW.Templates.Cell, 1, 1);
    obj.setHeaderHeight(30, 1);
    obj.setHeaderText(formText, 1, 1);

    document.write(obj);

You can also assemble your special cell/header template using AW objects -

var obj = new AW.Grid.Extended;

    obj.setCellText("cell");
    obj.setHeaderText("header");
    obj.setColumnCount(10);
    obj.setRowCount(10);

    var formTemplate = new AW.System.Template;
    formTemplate.setClass("item", "template");
    formTemplate.setClass("templates", "cell");

    var input = new AW.HTML.INPUT;
    input.setStyle("width", "30px");
    formTemplate.setContent("input", input);

    var button = new AW.HTML.BUTTON;
    button.setContent("html", "Click");
    formTemplate.setContent("button", button);

    obj.setHeaderCount(2);
    obj.setHeaderTemplate(formTemplate, 1, 1);
    obj.setHeaderHeight(30, 1);

    document.write(obj);

Alex:

Thanks. The last one looks most OOP-like. Definitely like it.