PDA

View Full Version : Not able to display Ext.picker.slot on clicking on image



murali3
27 Feb 2012, 3:34 AM
I need to display a Picker with slots on clicking of a image.

This is my code in {views}


NGS.views.favorites = Ext.extend(Ext.Panel,{
id:'faith',
title:'Faith',
scroll:'vertical',
style:'background-color:#ffffff',
items: [


{
xtype: 'fieldset',
layout: {
align: 'stretch',
type: 'vbox'
},
defaults:{
xtype: 'radiofield',
flex: 1,
labelWidth:'85%'
},
items: [
{
label: 'Intolerable',
name:'mode'
},
{
label: 'Tolerable',
name:'mode'
},
{
label: 'Compatible',
name:'mode'
},
{
label: 'Admirable',
name:'mode'
}
]
}
],
dockedItems: [
{
dock:'top',
cls:"faith",
width:'100%',
height:'50%'
},
{
html:'<div class="text_pane"><h3>faith <span>{noun} {feyth}</span>:</h3><ol><li>belief in God or in the doctrines or teachings of religion</li><li>a system of religious belief</li><li>a strong belief in a supernatural power or powers</li></ol><!--<span>If you ask almost any lady what kind of man she wants for a husband, she is likely to say to you, "I want a God fearing man." This probably because she believes that a God feating man will be more faithful and truthful.</span>--></div>'
},
{
xtype: 'toolbar',
dock: 'bottom',
items: [
{
xtype: 'button',
itemId: 'Previous',
ui:'back',
text: 'Previous',
handler: function () {
NGS.views.viewport.setActiveItem('mrf_home', { type: 'slide', direction: 'right' });
}
},
{
xtype: 'spacer'
},
{
xtype:'button',
text: 'Score Him',
handler: function () {
if(!this.picker)
{
this.picker = Ext.create('Ext.Picker',{
slots:[
{
name:'compat',
title:'Compatibility Score',
data:[
{text:'Intolerable', value:1},
{text:'Tolerable', value:2},
{text:'Compatible', value:3},
{text:'Intolerable', value:4}
]
}
]
} );
}
this.picker.show();
}
},
{
xtype: 'spacer'
},
{
xtype: 'button',
text: 'Next',
ui:'foward',
handler: function () {
NGS.views.viewport.setActiveItem('family', { type: 'slide', direction: 'left' });
}
}
]
}
]
});


Code for image



id: this.searchId,
label: '<span id="showFav" onclick="NGS.views.favorites" class="getfav"></span>',
labelWidth:30,


on clicking on button nothing is getting displayed. I am not getting any error message.

Can someone help me in resolving this issue.

mitchellsimoens
28 Feb 2012, 6:40 AM
I would make a plugin that would listen for tap events on the label element and open the picker just like it does when you tap on the mask (field).

murali3
28 Feb 2012, 10:35 PM
Thanks for the reply..

Any sample code for the reference

mitchellsimoens
29 Feb 2012, 6:01 AM
The label element is assigned labelEl on the field... just adding a tap listener to that (after render) to show the picker. Pretty simple stuff.