Placez le modèle html en haut de la vue dans sencha touch

Question

J'ai un élément de modèle html. Il se charge en bas de la vue même si je l'ai configuré en premier. Je veux le placer au-dessus de la vue. Une idée? tpl est cet élément de modèle

Mon code

config: { 
    title: 'Info ', 
    styleHtmlContent: true, 
    scrollable: true, 

    tpl: ['<table><tr><td><img src="{image}" height="60" width="60" id="{id}" /></td></tr>', 
     '<tr><td>{model}</td></tr>', 
     '<tr><td>{price}</td></tr>', 
     '<tpl for="color">', 
     '<tpl for="infos">', 
     '<tr><td>{name}: <tpl for="item_names"> ], 
    store: 'Item', 

    items:[ 

     { 
      xtype: 'fieldset', 

      items : [ 

       { 
        xtype : 'selectfield', 
        name : 'quantity', 
        label:'Quantity', 
        id: 'quantity' 
       },{ 
       other elements 
        } 


       ] 

      } 
    ] 

Answer 1

essayer cela,

config: { 

scrollable:true, 
styleHtmlContent:true, 

items:[ 
{ 
xtype: 'panel', 
title: 'Info ', 
style: 'margin-top: 0%;', 
height: '20%', // whatever height you want for templete 
width: '20%', // whatever width you want for templete 
styleHtmlCls:'details', 
tpl:['<table><tr><td><img src="{image}" height="60" width="60" id=" {id}" /></td></tr>', 
    '<tr><td>{model}</td></tr>', 
    '<tr><td>{price}</td></tr>', 
    '<tpl for="color">', 
    '<tpl for="infos">', 
    '<tr><td>{name}: <tpl for="item_names">'], 
store: 'Item', 
},  
{ 
xtype: 'fieldset',      
items : [        
{ 
    xtype : 'selectfield', 
    name : 'quantity', 
    label:'Quantity', 
    id: 'quantity' 
},{ 
    other elements 
    } 
] 

} 
    ] 
}, 

espère que cela peut vous aider.

Answer 2

Essayez de mettre pour la table css:

table { display: block; top: 0px;} 

Answer 3

Vous pouvez le faire en créant un autre composant et envelopper votre tpl à l'intérieur de ce composant. Vous pouvez ensuite inclure ce composant en tant qu'élément de votre vue:

items:[ 
    { 
     xtype: 'panel', 
     tpl: [ 
      '<table><tr><td><img src="{image}" height="60" width="60" id="{id}"/</td></tr>', 
      '<tr><td>{model}</td></tr>', 
      '<tr><td>{price}</td></tr>', 
      '<tpl for="color">', 
      '<tpl for="infos">', 
      '<tr><td>{name}: <tpl for="item_names">' 
     ], 

     store: 'Item' 

    }, 

    { 
     xtype: 'fieldset', 

     items : [ 

      { 
       xtype : 'selectfield', 
       name : 'quantity', 
       label:'Quantity', 
       id: 'quantity' 
      },{ 
       other elements     
      } 
     ] 

    } 
]