2

以下に示すようなグリッドを作成することは可能ですか?? hasmany 関連付けを持つ 2 つのモデルがあります。

Ext.define('Question', {
extend: 'Ext.data.Model',
fields: [
    {name: 'questionId', type: 'int', convert: null},
    {name: 'content',     type: 'string'},
    {name: 'type',     type: 'int'},
],
hasMany  : {model: 'Answer', name: 'answers'},

idProperty: 'questionId'});

Ext.define('Answer', {
extend: 'Ext.data.Model',
fields: [
    {name: 'answerId', type: 'int', convert: null},
    {name: 'question_id', type: 'int'},//foreignKey
    {name: 'content',     type: 'string'},
    {name: 'isCorrect',     type: 'boolean'},
    {name: 'isMarked',     type: 'boolean'},
],
 associations: [
    { type: 'belongsTo', model: 'Question' }
],
idProperty: 'answerId'});

JSON の例

{"data":[
{"questionId":4100,"content":"12:4?","type":"2","answers":
  [{"answerId":1051,"content":"11","isCorrect":true,"isMarked":false},    
   {"answerId":1052,"content":"11","isCorrect":false,"isMarked":false},      
   {"answerId":1053,"content":"11","isCorrect":false,"isMarked":false}
]},
{"questionId":4101,"content":"12:4?","type":"2","answers":
  [{"answerId":1054,"content":"11","isCorrect":true,"isMarked":false},    
   {"answerId":1055,"content":"11","isCorrect":false,"isMarked":false},      
   {"answerId":1056,"content":"11","isCorrect":false,"isMarked":false}
]}],"success":true}

グリッド ビューを表示するリンクは 次のとおりですhttp://imageshack.us/photo/my-images/834/examgrid.jpg/

質問の回答数が異なる場合もあれば、同じ数の回答が不可能な場合もあります。チェックボックスは isMarked フィールドのマーキングに使用されます。

誰かが私に例を挙げてもらえますか?

ありがとう

4

1 に答える 1

0

箱から出して、いいえ。はい、ビューを使用します。ただし、別のモデルを使用するのではなく、答えを質問に入れ子にすることをお勧めします。回答をレンダリングする内部関数を使用して XTemplate を作成する必要があります。

そのアプローチではソート可能な列はありません。これはもう少し手間がかかります。

最後のものも私に興味を持ったので、これは整形せずに切り取った作業です!!

Ext.define('Image', {
    extend: 'Ext.data.Model',
    fields: [
        { name:'question', type:'string' },
        { name:'answer', type:'auto' }
    ]
});


Ext.create('Ext.data.Store', {
    id:'imagesStore',
    model: 'Image',
    data: [
        { question:'Drawing & Charts', answer: [{text: 'yes'}, {text: 'no'}] },
        { question:'Advanced Data', answer: [{text: 'yes'}, {text: 'no'}] },
        { question:'Overhauled Theme', answer: [{text: 'yes'}, {text: 'no'}] },
        { question:'Performance Tuned', answer: [{text: 'yes'}, {text: 'no'}] }
    ]
});


var imageTpl = new Ext.XTemplate(
    '<Table>',
    '<tpl for=".">',
        '<TR>',
               '<TD>{#}</TD>',
            '<TD>{question}</TD>',
            '<TD>',
                '<tpl for="answer">',
                    '{text}',
                '</tpl>',
            '</TD>',
        '</TR>',
    '</tpl>',
    '</Table>'
);


Ext.create('Ext.view.View', {
    store: Ext.data.StoreManager.lookup('imagesStore'),
    tpl: imageTpl,
    itemSelector: 'div.thumb-wrap',
    emptyText: 'No images available',
    renderTo: Ext.getBody()
});

そしてJSFiddle

于 2012-09-24T05:14:03.367 に答える