PDA

View Full Version : I need a bit of help - Custom Submit / Other q's.



TotoTitus
10 Aug 2010, 7:38 AM
Hello everyone.
I am making some sort of a meebo-like webchat.
I chose ExtJS as framework because it has all the interface i need.
(I do not have much prior experience in web programming).

What i've done already, is only the entry form, and i've designed a custom window class(almost) to suit the application. (Custom width, height, etc).
The application will work by sending every message to MySQL, using Ajax. Also using Ajax, every user would poll the DB every each 0.4 seconds or so to receive new messages. Buddy lists would be stored in session variables, and the online status of buddies would also be done through Ajax polling. Basically SQL will handle everything.

1. Onto the first issue:



Ext.namespace('goodTalk.talkWindow');
goodTalk.talkWindow = Ext.extend(Ext.Window, {
constructor: function (username) {
goodTalk.talkWindow.superclass.constructor.call(this, {
id: 'talk' + username,
title: username,
resizable: false,
constrain: true,
renderTo: 'chat-area',
height: 300,
width: 500,
layout: 'absolute',
items: [{
xtype: 'displayfield',
style: 'top: 5px; left: 5px; font-size: 12px;'
},{
xtype: 'textarea',
itemId: 'talkBox',
style: 'top: 22px; left: 5px;',
height: 130,
width: 475,
autoScroll: true,
readOnly: true

},{
xtype: 'displayfield',
value: 'Say:',
style: 'top: 155px; left: 5px; font-size: 12px;'
},{
xtype: 'textarea',
itemId: 'sendBox',
style: 'top: 175px; left: 5px;',
height: 85,
value: 'bla',
width: 475
}]
});
}
});

This is my custom window, with custom design (Ok, except the layout: absolute, will change that) which will handle discussions between 2 users. Its constructor receives only 1 argument, the name of the buddy, which will be unique, so there are no issues with that.
What i would like here, is to catch a specific event : when a key is pressed on the second textArea, if the key is ENTER, an ajax submit to take place. There would be a file called submitMessage.php which would handle this, and only echo back {succes: true} or {success:false}.
How do i do that without extending the window from a form?...

2. I can't remember, or phrase my other questions right now, probably i'll post them here later on.

Thanks !

arthurakay
10 Aug 2010, 10:42 AM
Try using an Ext.KeyMap() to catch your "enter" event. Use the "fn" config to call your Ajax submission and any other logic you need.