PDA

View Full Version : Button Function



dwayne2700
6 Apr 2012, 9:38 AM
I apologize for the newbie question but I am trying to get an understanding of Sencha.

I'm trying to learn by doing little tasks. Here I was trying to learn how to tap a button and get a new view. Obviously I am not there. Could someone give me a tip on where to go study?


Ext.define('TCCapp.view.ContactUs', { extend: 'Ext.Panel',
xtype: 'contactus',

requires: [


'TCCapp.view.Email',
],



config: {
title: 'Contact Us',
iconCls: 'compose',


items: [

{
xtype: 'button',
text: 'Email Us',
ui: 'action',
minHeight : '33%',
handler: function () {
Ext.create ('TCCapp.view.Email');
}
}
]
}

});

mitchellsimoens
6 Apr 2012, 9:47 AM
The handler function should fire there. What are you wanting to do with the view you created?

dwayne2700
6 Apr 2012, 9:51 AM
I was just going to load this email contact form.


Ext.define('TCCapp.view.Email', { extend: 'Ext.form.Panel',
xtype: 'emailform',

requires: [
'Ext.form.FieldSet',
'Ext.field.Email'
],

config: {
title: 'Contact',
iconCls: 'user',
url: 'appmail.php',

items: [
{
xtype: 'fieldset',
title: 'Contact Us',
instructions: '(email is not required)',

items: [
{
xtype: 'textfield',
name: 'name',
label: 'Name',
},
{
xtype: 'emailfield',
name: 'email',
label: 'Email',
},
{
xtype: 'textareafield',
name: 'message',
label: 'Message',
}
]
},
{
xtype: 'button',
text: 'Send',
ui: 'confirm',
handler: function() {
this.up('contactform').submit();
}
}
]
}
});

mitchellsimoens
6 Apr 2012, 9:57 AM
load? Like add it to the panel that is the parent of the button?

dwayne2700
6 Apr 2012, 10:07 AM
See I told you a newbie question..:)

When that button is clicked the user is taken to the email form.

dwayne2700
6 Apr 2012, 1:44 PM
Ok, so I figured out part of what I was doing wrong. So I made some changes to my main controller and added an id to my button. but it is still not working. I do not even get any kind of error. If I change the function to
function() {
console.log("The Button was Pushed"); and I see it in the console.


Ext.define('TCCapp.controller.Main', { extend: 'Ext.app.Controller',

config: {
refs: {
blog: 'blog',
emailbutton: '#emailbutton',
},
control: {
'blog list': {
itemtap: 'showPost'
},
emailbutton: {
tap: 'onEmail'
},
}
},

onEmail: function()
{
this.contactus = Ext.create('TCCapp.view.Email');
},



showPost: function(list, index, element, record) {
this.getBlog().push({
xtype: 'panel',
title: record.get('title'),
html: record.get('content'),
scrollable: true,
styleHtmlContent: true
});
}
});