0

私の問題に似た投稿を見ましたが、解決策は私と一致していません。1 つ目は、グリッド パネルで列が正しく配置されていないことです。

ここに画像の説明を入力

次に、列 1 にデータがありません。これが私がそれを作った方法です：

// Data Tabe
var storeFields = Schedule.Calendar.panels.CallbackPanel.getDates(true);
storeFields.push('time');
/*
       storeFields will return: [0,0,0,0,.......0,'time']
    */
var callbackdata = Ext.create('Ext.data.ArrayStore', {
    fields: storeFields,
    data: Ext.create('Schedule.Calendar.data.CallbackData')
});

var callbackTable = Ext.create('Ext.grid.Panel', {
    id: 'callback-table',
    store: callbackdata,
    columns: [
        { header: 'Time',  dataIndex: 'time', id: 0},
        Schedule.Calendar.panels.CallbackPanel.getDates(false)
                         //This will return
                       /*
                       {
                       header : 0
                       dataIndex: '1'
                       id: 1
                       },
                       {
                       header : 1
                       dataIndex: '2'
                       id: 2
                       }
                       .
                       .
                       .
                       up to 30
                       */
    ],
    stripeRows : true,
    autoScroll: true,
    columnLines: true,
    listeners:{
        itemclick:
        function(grid, record, item, index, event){
            active_id = record.get('id');
        }
    },
    x: 0,
    y: 0,
    width: 1000,
    height: 435
});

cssファイルを含めていないことがわかっている限り、Extensible Calendar http://ext.ensible.comを使用しています。

私のhtmlのスニペットをここに示します：

<head>
<title>Extensible : Basic Calendar</title>
<!-- Sets up all Ext and Extensible includes: -->
<script type="text/javascript" src="../Extensible-config.js"></script>

<!-- Page-specific includes -->
<script type="text/javascript" src="basic.js"></script>

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<style>
    .sample-ct {      
        height: 500px;
        width: 1000px
        align: 'center'
    }

    .next-button {
        background-image: url("http://localhost/schedule/resources/images/custom/right_arrow.png");
    }
    .prev-button {
        background-image: url("http://localhost/schedule/resources/images/custom/left_arrow.png");
    }

</style>

これは私の簡単なデータです: - 午前 9 時 30 分までしか受け付けません。9:30 以下をコメントアウトすると正常に動作しますが、そうでない場合は配置がおかしくなります。

myJsonData: function() {

    var myData = {'items' : [
                    {'time': '1:00 AM'},
        {'time': '1:30 AM'},
        {'time': '2:00 AM'},
        {'time': '2:30 AM'},
        {'time': '3:00 AM'},
        {'time': '3:30 AM'},
        {'time': '4:00 AM'},
        {'time': '4:30 AM'},
        {'time': '5:00 AM'},
        {'time': '5:30 AM'},
        {'time': '6:00 AM'},
        {'time': '6:30 AM'},
        {'time': '7:00 AM'},
        {'time': '7:30 AM'},
        {'time': '8:00 AM'},
        {'time': '8:30 AM'},
        {'time': '9:00 AM'},
        {'time': '9:30 AM'},
        {'time': '10:00 AM'},
        {'time': '10:30 AM'},
        {'time': '11:00 AM'},
        {'time': '12:00 NN'},
        {'time': '12:30 NN'},
        {'time': '1:00 PM'},
        {'time': '1:30 PM'},
        {'time': '2:00 PM'},
        {'time': '2:30 PM'},
        {'time': '3:00 PM'},
        {'time': '3:30 PM'},
        {'time': '4:00 PM'},
        {'time': '4:30 PM'},
        {'time': '5:00 PM'},
        {'time': '5:30 PM'},
        {'time': '6:00 PM'},
        {'time': '6:30 PM'},
        {'time': '7:00 PM'},
        {'time': '7:30 PM'},
        {'time': '8:00 PM'},
        {'time': '8:30 PM'},
        {'time': '9:00 PM'},
        {'time': '9:30 PM'},
        {'time': '10:00 PM'},
        {'time': '10:30 PM'},
        {'time': '11:00 PM'},
        {'time': '12:00 MN'},
        {'time': '12:30 MN'}
    ]};

    return myData;

},

よろしく、 Ronel C.

4

0 に答える 0