10 Replies Latest reply on Mar 9, 2007 12:42 PM by Gil1

    Using Flex to build an online survey

      I have been toying with Flex 2 Builder, and am a fairly proficient ColdFusion developer. I was just handed a project that, while fairly "urgent" in timeline, would seem to be a perfect "first flex project" for me. The project specs are pretty straight-forward: ask a series of questions, which could be in several formats (choose all that apply, pick one, rank from 1-5 with 1 being strongly agree and 5 being strongly disagree, etc...), collect the user responses and store them in the database for later analysis.

      I envision a flex interface where the user is presented with each question or a block of related questions, and can move forward or backward through the survey until all questions have been answered... and then one final submit to store all the answers back on the server.

      The key words here are "flex newbie", but I'm wondering if there's a flex wizard which might move the process along, whereby I could "whip this one out pretty quickly", but also give myself a good intro to flex, learn, and go back later and fine tune.

      How would you build such an app, from the server-side to the flex interface itself (with forward and back buttons along the bottom border of the app, and submit button at the end; perhaps with nice transitions in between...) or, should I scrap the idea and just build it using a series of standard HTML pages?

      Thanks for any insight you can provide.... would love to use flex, but will also accept an answer of "under a tighter deadline, this may not be realistic..."

        • 1. Re: Using Flex to build an online survey
          ntsiii Level 3
          * HTTPService protocol
          * e4x resultFormat
          * ViewStack as a main container
          * HBox with buttons for navigation

          would be my advice.

          • 2. Re: Using Flex to build an online survey
            Camus Miu Level 1
            Tracy, what is "e4x resultFormat"???
            • 3. Using Flex to build an online survey
              dishmael Level 1
              E4X: A new approach to XML processing

              Until now, the ECMAScript edition 4 draft language specification (also known as ECMA-262), which is the basis for the core ActionScript 3.0 language, had no way of working with XML data. Earlier versions of ActionScript (from ActionScript 1.0 in Flash 5 and later) had classes and methods for working with XML data, but they were not based on the ECMAScript standard.

              The new ECMAScript for XML specification defines a new set of classes and functionality for working with XML data. These classes and functionality are known collectively as E4X. ActionScript 3.0 includes the following new E4X classes: XML, XMLList, QName, and Namespace.

              The methods, properties, and operators of the E4X classes were developed with the following goals:

              * Simplicity--Where possible, E4X makes it easier to write and understand code for working with XML data.
              * Consistency--The methods and reasoning behind E4X are internally consistent and consistent with other parts of ActionScript.
              * Familiarity--You manipulate XML data with well-known operators, such as the dot (.) operator.

              Tracy is referring to the resultFormat property of the HTTPService. Setting the resultFormat to e4x will have Flex parse the XML returned from the service. You can read more about HTTPService here:

              • 4. Re: Using Flex to build an online survey
                funaroma Level 1
                I stumbled upon the viewStack component probably around the same time you posted your response... thanks! :)

                I have jumped in with both feet, building the UI first before trying to figure out how I'm going to collect this information and store it on the server... not even a database design yet, which I'm fine with for now.

                A related question at this point: My MXML file is getting really big, because the survey is quite large with a lot of questions and a lot of choices per question. It would be great if each Canvas in my ViewStack could be in a separate MXML file, separating them somewhat so they are less cumbersome. Is it possible to somehow put them in their own MXML files, and then "include" them in the master MXML file? Should I be considering a different solution?


                • 5. Re: Using Flex to build an online survey
                  You should build a UI that retrieves that stuff from the backend, mabye a few different "template" question layouts and then depending on what step you are on the backend loads the data for that step, you app reads whats needed and sets the template to visible and then adds the needed text to the template and waits for the next step to be acivated by the user.

                  In short, try to do everthing on the backend that you can, you dont need anything other then the UI and functionality in your flex app, all the data should be handled by your backend.
                  • 6. Re: Using Flex to build an online survey
                    Nataliefay Level 1

                    I'm sorry to bug you with a non-technical discussion, but I am a recruiter in San Diego. My client is in need of 3 Senior Flex Developers for their project. I have had an extremely rough time finding someone for this position. Would you be interested in this position, or do you know of anyone that might be? We do pay referral fees. This position may be open to telecommuting.

                    Job Description:
                    They are in the midst of a major re-architecting of their Corporate Management system utilizing many cutting edge technologies. As it relates to the position they are using Flex as their UI.

                    This is either a contract, or a full-time position.

                    Pay: Market Rate

                    Thanks for your help!

                    Natalie Fay
                    Outsource Technical
                    • 7. Re: Using Flex to build an online survey
                      funaroma Level 1
                      Hi leotemp,

                      Thanks for your response. I agree with your statement in theory (certainly!), but since this is my first real project with Flex, and it's a tight deadline, I need to be careful not to take on too much at once. For now, the UI is implemented using a ViewStack with between one and four questions per canvas. Yes, it's making for a larger MXML file, but right now this is the only way I can conceive of doing this without burying myself in more unknowns. A little at a time... if I can't find a way to break it up, I'll just leave it whole for now. The app itself is not slow at all, so things are going okay so far.

                      There is one benefit to doing it this way - the survey downloads in full, and doesn't need to communicate with the server again until the user completes it in full and submits. This has an added benefit, I *think*, if I can get it to do it - the internet connection doesn't come into play as the person completes the survey, and perhaps I can detect an error when the survey is submitted, and ask the user if they'd like to submit the survey via an XML file containing their answers instead... so that they never lose their work no matter what happens with their internet connection. The app could check to make sure the connection to the server is valid upon final submit, and if for some reason it's not, it could ask them if they want to save a "special" (XML) file to their system for later submission once their internet connection is working again.

                      Is something like this possible, and if so, where should I start looking?

                      The UI is nearly done, at which point I need to move on to validation, and finally, storage of the survey-taker's answers.


                      • 8. Re: Using Flex to build an online survey
                        Camus Miu Level 1

                        The app could check to make sure the connection to the server is valid upon final submit, and if for some reason it's not, it could ask them if they want to save a "special" (XML) file to their system for later submission once their internet connection is working again.

                        I love this function, however, how do u save the data? Use the shareObject of Flash?? or Ask the user click "save my data" button?

                        Flash Player can export text data directly? (Since you can't use web program like php to export the data)
                        • 9. Re: Using Flex to build an online survey
                          funaroma Level 1
                          Here's an update to how I'm considering putting this survey app together:

                          -- An MXML file that contains entire UI

                          -- A separate mxml file, and the use of the mx:Model source="separateFileName.mxml" tag, to create an object called "Survey", that contains MXML representing the Questions and Answers in the survey, data-bound to the UI components and making it possible to do validation at each step/ViewStack canvas

                          -- A CFC that accepts the Survey object upon submit of the survey, and parses it/stores it as I see fit.

                          Is this a reasonable, simple course of action that has any chance of success?

                          • 10. Re: Using Flex to build an online survey
                            Gil1 Level 1
                            I am trying to build a similar application. However, I want the questions to be loaded from an external XML file. That way the same application can be used to deploy many surveys.

                            The problems I have are:
                            Each question has an attribute startPage (= yes or no). So, if yes, how do I create a new page?

                            Each question can be of a different type (or not). For instance questions can be open ended, multiple choice w/one or with multiple answers, matrix format, etc. Also, a question type could be drag and drop the corresponding elements, assigning priorities and more.

                            Thus, How I can render the different questions?
                            I can make a component for each type, but how I tell the program to show / not show a question.