logo

Making The Flex Categorised View Example Editable

Until now the Staff Skills database I've been talking about has been read only. Today I've added the ability to edit documents from the "view". Double-clicking a row now opens a form, which allows you to change the department and/or skills of an employee, as below:

image

Notice that when you update a document there's a slight pause and then the list of categories on the left has its labels updated to show the new count of documents in that category.

Note that, to do this, it does not load the XML for all 2500 documents again! All that happens is the server returns the XML that defines the newly-updated document and then the master XML object, which stores all the documents client-side, has the element which describes the current document updated. At this point the List object on the left updates the label on each item in it and the DataGrid gets updated if necessary.

To show the CheckBoxes on the form I'm using a Repeater object. The DataProvider for the Repeater is the same XML that's fed to the List on left and is defined in the XML loaded when the app first opens.

You can download the Flex source code here (you'll need this too) or you can just download the whole NSF (which has the Flex source Zips in the Files section).

Prize to the first person to spot the bug! Especially if you fix it!!

Comments

    • avatar
    • Nick
    • Tue 6 Oct 2009 06:49 AM

    Access doesn't show up as a category?

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 06:50 AM

    Top prize to Nick!

  1. Is the bug when you try to double click on a category?

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 06:59 AM

    Nope. But now you mention it...

  2. Changed this line -

    categories = new XMLList("<category>All</category>"+event.result.config.categories.category);

    There was a problem with the label function for the categories- I couldn't work out how to return 2 'labels' - 1 for All and 1 for Access so instead added a new node to the XMLList.

    Mark

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 08:19 AM

    Good thinking Mark. Although categories is also the dataProvider for the checkboxes on the form, so not sure that's the best way to do it? Would end up with a checkbox called "All". Perhaps having two XMLLists stored in memory is the only way to do it?

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 08:57 AM

    As a "temporary" hack I've bound the dataProvider for the List like so:

    dataProvider="{XMLList('<category>*</category>'+categories.toXMLString())}"

  3. Highlights why I don't like binding directly to results ;-)

    Always best to create a Data Transfer Object which represents your actual result object.

    I will have ago at reworking your staff skills app and send it back if you want to give you an idea what I am always going on about to Jerry ;-)

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 09:37 AM

    Not heard of DTO Mark and always interested in learning more/better ways of doing things. If you could send it over that would be great! If there are any other no-nos you can spot feel free to highlight those too.

    • avatar
    • Nick
    • Tue 6 Oct 2009 10:43 AM

    After updating an entry now the "All" category disappears.

    • avatar
    • Lisa
    • Tue 6 Oct 2009 12:02 PM

    Jake, I have downloaded flexbuilder and I have an app that could use the functionality I see in your staff skills db. I downloaded the db and exported the zip files. Beyond that I have not a clue what to do. I am very web savvy, proficient in html/js/css/xml/domino designer but completely new to flexbuilder. Any recommendations on how I can get started with your app?

    • avatar
    • Jake Howlett
    • Tue 6 Oct 2009 02:11 PM

    Nick. When will I learn than bug fixes can introduce new and require testing themselves. Fixed now. Thank!

    Lisa. Search this site for Flex and find the set of blog posts on "Flex quick start for Domino developers" or whatever I called it. It's not brilliant, but it;s a start.

    Then/Or watch as much as you have time to of the "Flex in a week" videos http://www.adobe.com/devnet/flex/videotraining/

    Welcome to Flex though, you'll love it! if you have any questions mail me offline and i'll try and help.

    • avatar
    • Ruediger
    • Fri 9 Oct 2009 10:59 AM

    Maybe not really a bug but a logical glitch:

    -- If I select two categories it sums up staff from both categories minus multitalented people... (who is in category "Access" OR "Ada")

    -- If I select one category and the pseudo category "All" than what? Now it does not sum up the members from both categories but shows the intersection of both groups (who is in category "All" AND "Access").

    Have you implemented this behaviour on purpose?

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


About This Page

Written by Jake Howlett on Tue 6 Oct 2009

Share This Page

# ( ) '

Comments

The most recent comments added:

Skip to the comments or add your own.

You can subscribe to an individual RSS feed of comments on this entry.

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »

More Content