2 Replies Latest reply on Aug 24, 2009 5:34 AM by adobe_panda

    Contact Form - <mx:ComboBox/> Submit data not label

    adobe_panda

      Hello all,

           First off I am new to Flex and have searched far and wide for the past couple of hours now for an answer to this question. How would you send the data to an email address and not the label (But maintaining the label posted inside the form)? I found some great tutorials on creating a general form for example the one at RIA Codes and the one posted Trap17.com, both are great for a general form.

           But, lets say if you go along with the tutorial and want to add a combo box that selects the person you would like to email, without displaying the email address. Lets say we add-on a combobox to the RIA Codes tutorial, in order to select who the email will go to. This is what I have below and it works, just it keeps putting in the label in rather than the data (in Bold Below). Granted, I could just change the labelField="@label" to labelField="@data" but this would display the email address, which I do not want.

           Essentially I am trying to figure out a way to show the Persons Name and not the email in the contact form, but when you submit the form it would post the data (containing the email) and not the label (containing the Person's Name), so that the php would show something like this $sendToEmail = $_POST['recieverEmail']; and send the email. Thank you in advance for your help on this.

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

      <mx:Style source="style.css"/>

      <mx:Script>
         <![CDATA[
            import mx.events.ValidationResultEvent;
            import mx.controls.Alert;

            private function sendMail():void{
               var _senderName:String = senderName.text;
               var _senderEmail:String = senderEmail.text;
               var _recieverEmail:String = recieverEmail.text;
               var _emailMessage:String = emailMessage.text;
               var _emailSubject:String = emailSubject.text;

               var evValidMail:ValidationResultEvent = mailValidator.validate();
               var evValidContact:ValidationResultEvent = contactValidator.validate();
               var evValidName:ValidationResultEvent = nameValidator.validate();
               var evValidMessage : ValidationResultEvent = mailValidator.validate();

               if (evValidMail.type == ValidationResultEvent.VALID
               && evValidName.type == ValidationResultEvent.VALID
               && evValidContact.type == ValidationResultEvent.VALID
               && evValidMessage.type == ValidationResultEvent.VALID){
               emailService.send({senderName:_senderName, senderEmail:_senderEmail, recieverEmail:_recieverEmail, emailSubject:_emailSubject, emailMessage: _emailMessage});
               }
               else{
                  resultLabel.text="There are Form errors";
                  resultLabel.setStyle("styleName", "invalid");
               }
            }

            private function emailResult():void{
                  Alert.show("Thank you for contacting us");
                  clearForm();
            }

            private function clearForm():void{
               resultLabel.text="";
               recieverEmail.selectedIndex = 0;
               emailSubject.text="";
               emailMessage.text="";
            }
      ]]>
      </mx:Script>

         <mx:HTTPService id="emailService" url="mail.php" method="POST" resultFormat="xml" result="emailResult()" useProxy="false"/>
         <mx:EmailValidator id="mailValidator"
            source="{senderEmail}" property="text"
            requiredFieldError="Enter your email" required="true" />
         <mx:StringValidator id="contactValidator"
                 source="{recieverEmail}" property="text"
                 requiredFieldError="Select a contact" required="true" />

         <mx:StringValidator id="nameValidator"
            source="{senderName}" property="text"
            requiredFieldError="Enter your name" required="true"/>
         <mx:StringValidator id="emailValidator"
            source="{emailMessage}" property="text"
            requiredFieldError="Enter your message" required="true"/>

         <mx:Panel height="401" width="400" layout="absolute" title="Contact us">
            <mx:Form x="9" y="10" width="360">
               <mx:FormItem label="Name :">
                  <mx:TextInput id="senderName" width="200"/>
               </mx:FormItem>
               <mx:FormItem label="Email :">
                  <mx:TextInput id="senderEmail" width="200"/>
               </mx:FormItem>
               <mx:FormItem label="Contact :">
                   <mx:ComboBox id="recieverEmail" width="200" selectedIndex="0" dataProvider="{contactXMLList}" labelField="@label" />
               </mx:FormItem>

               <mx:FormItem label="Subject :">
                  <mx:TextInput id="emailSubject" width="200"/>
               </mx:FormItem>
               <mx:FormItem label="Message :">
                  <mx:TextArea id="emailMessage" height="130" width="200"/>
               </mx:FormItem>
            </mx:Form>
             <mx:Button label="Submit" click="sendMail()" x="138" y="274"/>
            <mx:Label id="resultLabel" x="212" y="276"/>
         </mx:Panel>

       

         <mx:XMLList id="contactXMLList">
               <recieverEmail label="Person 1" data="person1@domain.com"/>
              <recieverEmail label="Person 2" data="person1@domain.com"/>
              <recieverEmail label="Person 3" data="person2@domain.com"/>
              <recieverEmail label="Person 4" data="person3@domain.com"/>
              <recieverEmail label="Person 5" data="person4@domain.com"/>
         </mx:XMLList>

        
      </mx:Application>