PDA

View Full Version : Approach suggestions



jasondeegan
10 Sep 2009, 1:57 PM
I am embarking on writing a simple window that allows me to manage contact address (phone, email, web, etc.) that mirrors that of an iPhone contact app or G1 contact app.

Essentially, it'll Look like this:

NAME
Phones
404.578.0000
404.928.0000
[ type new phone here ]
Emails
[email protected]
[email protected]
[ type new email here ]
Websites
[ type new website here ]

So, the question is, how would the experts (those that peruse these forums) go about writing this?

A)
Would it be one big grid, leaving the category titles (Phones, Emails and Websites) uneditable? Is it easy enough for a mid-level ExtJS guy to add rows at the correct spot for when they start adding new contact data (like phone, the row below phone would show up and say "type new...")?

B)
Is it a window with multiple Forms? This approach, though, seems to limit the number of addresses I can have per category?!? Or maybe not.

C)
Something else?

Thanks for your suggestions.

Condor
11 Sep 2009, 5:46 AM
All kinds of solutions, all depending on how you want the application to look.

An editable grouped grid would do (with an extra row per group for a new entry), but you can also create this with a form with textfields in fieldsets. Even an editable tree could work...

jasondeegan
11 Sep 2009, 10:25 AM
So I've decided to go the FORM route.

After doing some searching, I can't seem to figure out how to add 3 phone fields if the user has 3 phone numbers. And if they only have 2, just 2. Maybe I'm missing the forest through the trees?

Would I do this via the form load() function. I have the ability to add fields on the fly to my form: (thanks to another poster)



Ext.ux.OrderedFormPanel = Ext.extend( Ext.FormPanel, {
addAfter : function( a, c ){
for( var i = 0 ; i < this.items.items.length ; i++ ){
if( this.items.items[i] == a ){
this.insert( i + 1, c );
return;
}
}
},
addBefore : function( a, c ){
for( var i = 0 ; i < this.items.items.length ; i++ ){
if( this.items.items[i] == a ){
this.insert( i, c );
return;
}
}
},
removeLast : function( ){
this.remove( this.items.items.length - 1 );
},
removeLastfromFieldSet : function( fs ){
this.findById( fs ).remove( this.findById( fs ).items.items.length -1 );
}
});

Condor
11 Sep 2009, 10:19 PM
No, the form load method is to load values into fields.

You'd have to load the data using Ext.Ajax.request and create fields for the data you received.