5 Replies Latest reply on Sep 8, 2010 8:02 AM by rootsounds

    n00b needs some help.

    LikeMe24

      Hi all,

       

      Im new to flex and im a little stuck and could really do with some help.

       

      I have a small project to get completed and im not sure how and the best way to go about it.

       

      Ok quick outline of the project.

       

      I have a main panel then within this I have a viewstack. Within each viewstack nav container there is 5 questions and 5 radio buttons.

       

      Each viewstack nav container will be populated from a database that is already setup.

       

      Im unsure of what is the best way to acheive this. I had thought about puting the nav container with the questions and radio buttons into a seperate component, and getting the information from the database and looping through it and displaying a component and populating the component parts with the data from the database.

       

      Would this be a good way of doing it? How would I take the data from the database and pass it to each seperate component as its created?

       

      Im really stuck here so if anyone could give me some advise or help I would be very thankful.

        • 2. Re: n00b needs some help.
          LikeMe24 Level 1

          Thanks, this kind of helps. Let me explain a bit more what im trying to do.

           

          I have a database with 12 questions and i want to have a viewstack that the user can navigate through and answer 1 question per viewstack

          NavigatorContent.

           

          Each viewstack NavigatorContent would have 1 question and 5 radio buttons for the answer.

           

          So i need to have a way of looping through each question from the database and displaying the question and 5 radio buttons.

           

          I was thinking of puting the questions and radio buttons in a seperate component then looping through the results from the database query and populating the question part.

           

          Does this make any sense?

          • 3. Re: n00b needs some help.
            rootsounds Level 4

            There are 2 approaches that you could take:

            1. Query for all of the questions at once.
            2. Get the questions 1 at a time from the db.

             

            Since there aren't many, you can probably just grab them all.

             

            You need only a single stack of radio buttons which will be automatically generated by the repeater, as shown in the above example. All that you have to do is provide a control such as a button that will iterate through to the next question, changing where the repeater's dataprovider is pointing (which would be data for a question).

            • 4. Re: n00b needs some help.
              LikeMe24 Level 1

              Thanks for the help rootsounds but im still a bit confused.

               

              This is the code i want to repeat for each viewstack nav cont

               

              <?xml version="1.0" encoding="utf-8"?>

              <s:NavigatorContent

               

               

              xmlns:fx="http://ns.adobe.com/mxml/2009"

              xmlns:s="

              library://ns.adobe.com/flex/spark"

              xmlns:mx="

              library://ns.adobe.com/flex/mx" width="100%" height="100%">

               

               

              <fx:Declarations>

               

               

              <!-- Place non-visual elements (e.g., services, value objects) here -->

               

               

              </fx:Declarations>

               

               

              <s:HGroup x="0" y="0" width="100%" height="40">

               

               

              <s:Label text="Question 1" id="qHead" paddingTop="10" paddingLeft="10" fontSize="20" fontWeight="bold"/>

               

               

              </s:HGroup>

               

               

              <s:HGroup x="11" y="51" width="100%" height="20">

               

               

              <s:VGroup width="20%" height="20">

               

               

              <s:CheckBox label="Level 1" fontSize="14"/>

               

               

               

              </s:VGroup>

               

               

              <s:VGroup width="20%" height="20">

               

               

              <s:CheckBox label="Level 2" fontSize="14"/>

               

               

               

              </s:VGroup>

               

               

              <s:VGroup width="20%" height="20">

               

               

              <s:CheckBox label="Level 3" fontSize="14"/>

               

               

               

              </s:VGroup>

               

               

              <s:VGroup width="20%" height="20">

               

              <s:CheckBox label="Level 4" fontSize="14"/>

               

               

              </s:VGroup>

               

              <s:VGroup width="20%" height="20">

               

              <s:CheckBox label="Level 5" fontSize="14"/>

               

               

              </s:VGroup>

               

              </s:HGroup>

               

              <s:HGroup x="10" y="81" width="100%" height="537">

               

              <s:VGroup width="20%" height="500">

               

              </s:VGroup>

               

              <s:VGroup width="20%" height="500" paddingLeft="10" paddingRight="10" paddingTop="10">

               

              </s:VGroup>

               

              <s:VGroup width="20%" height="500">

               

              </s:VGroup>

               

              <s:VGroup width="20%" height="500">

               

              </s:VGroup>

               

              <s:VGroup width="20%" height="500">

               

              </s:VGroup>

               

              </s:HGroup>

              </s:NavigatorContent>

               

               

               

               

              This will produce a template for each question.

               

              so i want to repeat all this for each question to build the view stack.

               

              Thanks

              • 5. Re: n00b needs some help.
                rootsounds Level 4

                What you're after is a single layout that is consistent for each question. The basics needed are a label for the question, a checkbox group built using a repeater (as in the above example), and a button to take you to the next question.

                 

                The piece that's missing which you seem to be unfamilar with is Flex's data binding capability. What this allows you to do is to bind properties of some object (example: label of a Button) to an object (or property of an object). If the source data changes, this gets automatically propegated to the destination objects. For your purposes, you would be binding the label to a string somewhere in your data model and the dataprovider of the repeater to a collection of strings for the answers. When moving to the next question, you update the source objects.

                 

                http://livedocs.adobe.com/flex/3/html/help.html?content=databinding_1.html