16.12.2009 07:57
MaXyC 5 1700 Источник


Наткнулся на днях на интересный пример, как сделать Ext.Grid из неотформатированной таблички. Делается все буквально одной строчкой. Для начала создадим HTML таблицу:

Barney Rubble 32 Male
Fred Flintstone 33 Male
Betty Rubble 32 Female
Pebbles 1 Female
Bamm Bamm 2 Male


Затем создаем кнопку:

<button id="create-grid" type="button">Create grid</button>



У нас получилось



Сам код кнопки:
/*!
 * Ext JS Library 3.0+
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
Ext.onReady(function(){
    // находим кнопку
    var btn = Ext.get("create-grid");

    // обработчик нажатия на кнопку
    btn.on("click", function(){
        btn.dom.disabled = true;

        // создаем таблицу
        var grid = new Ext.ux.grid.TableGrid("the-table", {stripeRows: true});
        grid.render(); // показываем таблицу
    }, false, {
        single: true
    }); // выполнять только один раз
});


Результат после нажатия на кнопку:



Скачать демку «HTML 2 Ext.Grid» можно здесь

Комментарии (5)


  1. OldFornit
    16.12.2009 08:34
    #2288611

    некрасиво таким образом расставлять ссылки на свой ресурс.


    1. MaXyC Автор
      16.12.2009 08:34
      #2288618

      прошу прощения. запутался в «кросспостах» статьи.


  1. inkover
    16.12.2009 08:34
    #2288697

    а еще много других красивостей ExtJS тут: www.extjs.com/deploy/dev/examples/samples.html

    в чем смысл статьи?


    1. MaXyC Автор
      16.12.2009 08:34
      #2288755

      смысл в том, чтобы привлечь внимание к примерам и документации на офф сайте.

      оффтоп: статья была билетом на хабр, как не удивительно. и, копаясь сегодня в черновиках, случайно ее обнаружил и открыл.


      1. inkover
        16.12.2009 08:34
        #2288777

        тогда и нужно в конце написать типа «другие примеры можно посмотреть тут, а документацию тут. а тут — основной сайт ExtJS». %)

        кстати, это не встроенная фича ExtJS, а пользовательское дополнение (ux == User Extension). так что не очевидно, к чему эта статья привлекает внимание.