PDA

View Full Version : Combobox, append add element buttons to drop down list



vladka
3 Nov 2011, 2:37 AM
Hello.

User write some text to combobox, if there no records in drop down list, i want to append "Add element" link.

Found that on load event fires when combobox loads data from server.
So have some code like this:


sload = function( store, records , success, operation, eOpts ) {
if(records.length < 1) {
// create and append link to a combox drop down list
}
}

combobox.store.on('load', sload);

Can't find how to create link with on click listeners and how to add this link to drop down list ?

mitchellsimoens
3 Nov 2011, 6:32 AM
Create an extension of ComboBox and listen for the store's datachanged event. On that event listener, do a getCount() onto the store and if it equals zero then append an element to the list and add a listener for that element click. Remember to clean it up if getCount() is greater than zero.

vladka
3 Nov 2011, 6:38 AM
Question is how to add element to list, because just:

onload = function( store, records , success, operation, eOpts ) {
if(records.length < 1) {
records.push('<a href="#"> add element </a>')
}
}

did no results.

Ext.DomHelper request to append element to existen html code.

mitchellsimoens
3 Nov 2011, 6:43 AM
I never said add a record... Use DomHelp to create a new Element.

vladka
3 Nov 2011, 7:40 AM
tell me please what do you mean by saying:

> and if it equals zero then append an element to the list


onDatachanged = function( store, eOpts ) {
// do a getCount() onto the store
if(store.getCount() < 1) {
//
el = {
'tag': 'a',
'name' : 'element-name',
'class' : 'btn-add',
listeners: {
click: {
element: 'el',
fn: function(){ console.log('click el'); }
}
}

d = Ext.DomHelper
href = d.createDom(el)
// if it equals zero then append an element to the list -what do you mean by saying this ?
// I don't understand how to make a <a href="#"> </a> to appear in list
// ?
store.add(href ) // this is wrong i think
}
}

// Listen when data changed
combobox.store.on('datachanged ', onDatachanged );

redraid
3 Nov 2011, 8:32 AM
onDatachanged = function( store, eOpts ) {
// do a getCount() onto the store
if(store.getCount() < 1) {
//
var el = {
'tag': 'a',
'name' : 'element-name',
'class' : 'btn-add',
listeners: {
click: {
element: 'el',
fn: function(){ console.log('click el'); }
}
};
d = Ext.DomHelper;
//---------------------------------------------------------------
var spec = {tag: 'li', children: [el]};
d.insertFirst(combobox.getPicker().el.down('ul'), spec);
//---------------------------------------------------------------
}
}

// Listen when data changed
combobox.store.on('datachanged ', onDatachanged );