Set row span for table layout

 

<html>
<head>
<title>Hello World Window</title>
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" />
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script>

</head>
<body>
<script type="text/javascript">
Ext.onReady(function() {

        var myWin = new Ext.Window({
          height       : 300,
          width        : 300,
          border       : false,
          autoScroll   : true,
          id           : 'myWin',
          title        : 'A Window with a Table layout',
          layout       :'table',
          layoutConfig : {
            columns : 3
          },
          defaults : {
            height : 50,
            width  : 50
          },  
          items : [
            {
              html    : '1',
              rowspan : 3,
              height   : 150 
            },
            {
              html    : '2',

            },
            {
              html : '3'
            },
            {
              html    : '4',

            },
            {
              html : '5'
            },
            {
              html : '6'
            },
            {
              html : '7'
            },
            {
              html : '8'
            },
            {
              html : '8'
            },            
            {
              html    : '9',

            }
          ]
        });
        
        myWin.show();



});
</script> 
<div id='div1'>asdf</div>
</body>
</html>

Related examples in the same category

1.	Table layout window
2.	Set column count for table layout
3.	Set default cell width and height for table layout
4.	Set column span for table layout
5.	Set cell height
6.	Set width for table cell

Set row span for table layout : Table Layout « Ext JS « JavaScript DHTML

Related examples in the same category