Cool Code at Lunch Webinar – Flex & Salesforce

September 25th, 2009

I was the guest speaker on our “Cool Code at Lunch” webinar yesterday where I showed the basics of developing, upload and running a Flex application on Salesforce with the Force.com Toolkit for Adobe AIR and Flex. The example app was a simple DataGrid populated with Contacts.

CoolCode-Flex

The application turned out to be a really good starting point for most Flex applications so I thought I’d post it and see if it helps anyone out. I has methods for querying, creating and deleting data.

You’ll need to download the Force.com Toolkit for Adobe AIR and Flex toolkit here to run this example.

Flex Application – main.mxml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="600" height="300"
    backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]" creationComplete="init()">
 
	<mx:Script>
		<![CDATA[
 
        import mx.collections.ArrayCollection;
        import mx.controls.Alert;
        import com.salesforce.*;
        import com.salesforce.objects.*;
        import com.salesforce.results.*;
 
        [Bindable] private var sfdc:Connection = new Connection();
        [Bindable] private var isLoggedIn:Boolean = false;
        [Bindable] private var contacts:ArrayCollection = new ArrayCollection();
        [Bindable] private var userId:String;
 
        private function init():void {
			login();
			if (Application.application.parameters.userId == null) {
			    userId = "005600000000000";
			} else {
			    userId = Application.application.parameters.userId;
			}
        }
 
        private function getContacts():void
        {
 
            sfdc.query("select id, name, email from contact",
                 new AsyncResponder(
                    function (qr:QueryResult):void {
                       if (qr.size > 0) {
                            for (var i:int=0;i<qr.size;i++) {
 
                            	// create a new object to hold the data
                            	var c:Contact = new Contact();
                            	c.email = qr.records[i].Email;
                            	c.id = qr.records[i].Id;
                            	c.name = qr.records[i].Name;
 
                            	// add the object to the array collection
                            	contacts.addItem(c);
 
                            }
                        }
                    },sfdcFailure
                )
            );
 
        }
 
		private function createContact(c:Contact):void {
 
			// create an array to send to sfdc
			var aSo:Array = new Array();
 
			// create a new contact sObject to populate with data
			var so:SObject = new SObject("Contact");
			so.FirstName = c.first;
			so.LastName = c.last;
			so.Email = c.email;
 
			// add the sObject to the array
			aSo.push(so);
 
			sfdc.create(aSo,
				new AsyncResponder(
					function createResults(obj:Object):void {
						if (obj[0].success == false) {
							Alert.show(obj[0].errors[0].message.toString(),"Error creating new contact");
						} else {
							// do something like update the collection
						}
					}, sfdcFailure
				)
			);
 
		}
 
		public function updateContact(c:Contact):void {
 
			// create an array to send to sfdc
			var aSo:Array = new Array();
 
			// create a new contact sObject to populate with data
			var so:SObject = new SObject("Contact");
			so.Id = c.id;
			so.FirstName = c.first;
			so.LastName = c.last;
			so.Email = c.email;
 
			// add the sObject to the array
			aSo.push(so);
 
			sfdc.update(aSo,
				new AsyncResponder(
					function updateResults(obj:Object):void {
						if (obj[0].success == false) {
							mx.controls.Alert.show(obj[0].errors[0].message.toString(),"Error updating contact");
						} else {
							// do something like update the collection
						}
					}, sfdcFailure
				)
			);
		}
 
        private function login():void {
 
            var lr:LoginRequest = new LoginRequest();
 
            // hard code values for dev/local
            if (this.parameters.server_url == null) {
 
            	//sfdc.protocol = "http";
	            sfdc.serverUrl = "http://na5.salesforce.com/services/Soap/u/14.0";
	            lr.username = "YOUR_USERNAME";
	            lr.password = "YOUR_PASSWORD&YOUR_TOKEN";
 
            } else {
 
                lr.server_url = this.parameters.server_url;
                lr.session_id = this.parameters.session_id;
            }
 
            lr.callback = new AsyncResponder(loginSuccess, loginFault);
            sfdc.login(lr);
 
        }
 
        private function loginSuccess(result:Object):void {
            isLoggedIn = true;
            // start calling methods...
            getContacts();
        }
 
        private function loginFault(fault:Object):void {
            mx.controls.Alert.show("Could not log into SFDC: "+fault.fault.faultString,"Login Error");
        }
 
        private function sfdcFailure(fault:Object):void {
            Alert.show(fault.toString());
        }
		]]>
	</mx:Script>
 
	<mx:DataGrid left="5" right="5" top="5" bottom="5" id="dg" dataProvider="{contacts}">
		<mx:columns>
			<mx:DataGridColumn headerText="Id" dataField="id"/>
			<mx:DataGridColumn headerText="Name" dataField="name"/>
			<mx:DataGridColumn headerText="Email" dataField="email"/>
		</mx:columns>
	</mx:DataGrid>
 
</mx:Application>

Contact Value Object – Contact.as

1
2
3
4
5
6
7
8
9
10
11
12
13
 
package
{
	public class Contact
	{
		public var id:String;
		public var first:String;
		public var last:String;
		public var name:String;
		public var email:String
 
	}
}

Visualforce page – MyPage.page

1
2
3
4
5
<apex:page >
    <apex:flash src="{!$Resource.CoolCode}"
        width="600" height="300"
        flashvars="userId={!$User.Id}&session_id={!$Api.Session_ID}&server_url={!$Api.Partner_Server_URL_130}" />
</apex:page>
  • Share/Bookmark

Related posts:

  1. Displaying Validation Messages with Flex and Salesforce.com
  2. Developing Flex Applications for Force.com Sites
  3. Developing Salesforce.com Applications with Flex and Visualforce
  4. Flex Salesforce.com Tree Control
  5. Handling asynchronous Flex calls to Salesforce.com using an MVC framework

Categories: Appirio, Flex, Salesforce, Visualforce

Leave a comment

Comments Feed6 Comments

  1. apexsutherland

    Is it just me or is that a LOT of code just to get a simple data grid?

  2. apexsutherland

    …I realize this was just a demo exercise, but I find it interesting how many lines of code it takes to get to a simple data grid in Flex…what does it take to get to something seriously functional?

  3. Robert

    I found your example very helpful. Thank you for posting it.

    I ran into trouble with logging in, but after solving the security issues and successfully logging in, I still get an [object fault] from the sfdcFailure method called from the getContacts() method. From other examples, I see this method follows a standard method structure for calling SF objects, so I don’t know what is causing the fault.

  4. jeffdonthemic

    What are the details in the fault object. You should be able to inspect the object using the Flex debugger.

  5. Anjali

    From where the createContact/updateContact methods are getting invoked?

  6. Jeff Douglas

    Anjali, they are not being called. I just put them in for reference. You can do if from the datagrid and setup listeners for each method.

Leave a comment

Feed

http://blog.jeffdouglas.com / Cool Code at Lunch Webinar – Flex & Salesforce