ActiveWidgets • I'm working on a Grouped Grid...

Hi,

This script is unbelieveble...

I'm working on a Grid like a related Tables of Microsoft Access, that Open Grid inside a Grid... But I can't understand all the methods of this script (ehhehe... it's too long)...

My Idea is a thing like this:

<html>

<head>



  <style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>

  <link href="./runtime/styles/xp/grid.css" rel="stylesheet" type="text/css"  />



  <script src="./runtime/lib/grid.js"></script>



  <style>

    .active-controls-grid {height: 100%; font: menu;}

    .active-column-0 {width:  30px; background-color: threedlightshadow;}

    .active-column-1 {width: 200px; }

    .active-column-2 {}

    .active-column-3 {text-align: right;}

    .active-column-4 {}

  </style>



  <script>



    var myData = [

      ["1","<div id='d12' style='position: related; top: 0px; z-index: -15; border: 1px solid; height: 100px; width: 100px'><img src='' onclick='document.all.d12.innerHTML = obj12;' ></div>Teste 1", "pagina1", "1", "sim"],

      ["2","Titulo Diferente", "teste", "2", "sim"],

      ["3","Teste 3", "Juca", "13", "sim"],

      ["4","Este aqui é bizarro", "bizarro", "4", "nao"],

      ["5","Teste 5", "teste5", "5", "nao"],

      ["6","Teste 6", "nome6", "16", "sim"],

      ["7","Teste 7", "nome7", "7", "sim"],

      ["8","Teste 8", "nome8", "8", "sim"]

    ];



    var myColumns = [

      "#ID", "Titulo", "Nome", "Ordem", "Ativo"

    ];









    var myData12 = [

      ["2","Titulo Diferente", "teste", "2", "sim"],

      ["3","Teste 3", "Juca", "13", "sim"]

    ];



    var myColumns12 = [

      "#ID", "Titulo", "Nome", "Ordem", "Ativo"

    ];





  </script>



</head>

<body>



  <div id="d0">



  </div>



  <script>



    var obj = new Active.Controls.Grid;



    obj.setRowCount(8);

    obj.setColumnCount(5);



    obj.setDataText(function(i, j){return myData[i][j]});

    obj.setColumnText(function(i){return myColumns[i]});



    var row = obj.getTemplate("row");

    row.setEvent("ondblclick", function(){this.action("myAction")});

    obj.setAction("myAction", function(src){alert(src.getProperty("item/index"))});



    document.all.d0.innerHTML = obj;





    var obj12 = new Active.Controls.Grid;



    obj12.setRowCount(2);

    obj12.setColumnCount(5);



    obj12.setDataText(function(i, j){return myData12[i][j]});

    obj12.setColumnText(function(i){return myColumns12[i]});



    var row12 = obj12.getTemplate("row");

    row12.setEvent

    (

      "ondblclick",

      function()

      {

        this.action("myAction")

      }

    );

    obj12.setAction

    (

      "myAction",

      function(src)

      {

        alert(src.getProperty("item/index"))



        var value = src.getProperty("item/index");

        return (value & 1) ? "#ddd" : "black";





      }

    );





  </script>



</body>

</html>

When a click in a image in the 2nd field of a grid, it displays an other Grid...

But I can't display a DIV in other DIV... How can I do something like this ??? Some Ideas ?

Thanks, and excuse-me for my Bad English !

Valber Marcel Bueno
Campinas - SP - Brasil

I'm working on a Grouped Grid...

Forum search