Scenario:
The CRM users need the ability to retrieve, update, and Save form data from within a custom page on the CRM Form. To accomplish this request we will be developing a Silverlight Web Resource.
The Silverlight Web Resource will be displayed on the CRM form to provide the user interface for retrieving and updating the data on the Account Form.
Requirements:
- CRM 2011
- Visual Studio 2010
- CRM 2011 SDK
http://www.microsoft.com/downloads/en/details.aspx?FamilyID=420f0f05-c226-4194-b7e1-f23ceaa83b69
Create a Silverlight Application
Step by Step
1. Create a new Silverlight Project:
a. Open Visual Studio 2010.
b. Click File | New | Project.
c. Under Installed Templates, click Visual C# | Silverlight and choose Silverlight Application. Name the project "SilverlightAccountPage". Click OK.
Image may be NSFW.
Clik here to view.
d. Click Ok on the next window which will automatically create an Web project to host the Silverlight Application.
Image may be NSFW.
Clik here to view.
2. Add a TextBox and Buttons to the MainPage.xaml page.
a. Within Solution Explorer right click on the MainPage.xaml page and choose View Designer.
b. Click View|Toolbox. When the toolbox window opens click the pin icon to keep the window open.
Image may be NSFW.
Clik here to view.
c. Find the TextBox control within the Toolbox window. Drag the TextBox control onto the MainPage.xaml. This creates a single Textbox on the page.
Image may be NSFW.
Clik here to view.
d. Right click the TextBox control and choose Properties. The properties window will display on your right hand side.
Image may be NSFW.
Clik here to view.
e. At the top of the Properties window change the name to txtAccountName.
Image may be NSFW.
Clik here to view.
f. Find the Button control within the Toolbox window. Drag the Button control onto the MainPage.xaml page under the textbox. This creates a single Button on the page.
Image may be NSFW.
Clik here to view.
g. Right click the Button control on the MainPage.xaml page and choose Properties. The properties window will display on your right hand side.
Image may be NSFW.
Clik here to view.
h. At the top of the Properties window change the name to btnUpdateData and update the Content property to “Update Data”.
Image may be NSFW.
Clik here to view.
i. Add one more button to the page with the name of btnSaveData and Content property of “Save Data”.
Image may be NSFW.
Clik here to view.
3. Add code to the Button’s Click Event.
a. Double-Click the Set Data Button control on the MainPage.xaml page. This will take you to the MainPage.xaml.cs file where we can see the btnSetData_Click method.
Image may be NSFW.
Clik here to view.
b. Add the following code within the btnSetData_Click code method. This updates the name attribute on the Account form.
private void btnSetData_Click(object sender, EventArgs e)
{
//Update Account Name attribute on the form.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
xrm.Page.data.entity.attributes.get("name").setValue(txtAccountName.Text);
}
c. Double-Click the Save Data Button control on the MainPage.xaml page. This will take you to the MainPage.xaml.cs file where we can see the btnSaveData_Click method.
Image may be NSFW.
Clik here to view.
d. Add the following code within the btnSetData_Click code method. This fires the save action similar to Save button on the form.
private void btnSaveData_Click(object sender, EventArgs e)
{
//Fire Save method to commit form changes.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
xrm.Page.data.entity.save()
}
e. Add the following code within the MainPage method. This retrieves the current account name value when the page is loaded.
public void MainPage()
{
InitializeComponent();
//Populate textbox with current account name value.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
txtAccountName.Text = xrm.Page.data.entity.attributes.get(“name”).getValue();
}
4. Add the Microsoft.CSharp assembly as reference.
a. Locate the Solution Explorer, right-click References and choose Add Reference.
Image may be NSFW.
Clik here to view.
b. In the Add Reference browser window, click the .NET tab.
c. Choose Microsoft.CSharp, and click OK.
Image may be NSFW.
Clik here to view.
d. Add the following using statements at the top of the Default.aspx.cs file.
using System.Windows.Browser;
e. The completed code should look similar to the following.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Browser;
namespace SilverlightAccountPage
{
public partial class MainPage : UserControl
{
public MainPage()
{
InitializeComponent();
//Populate textbox with current account name value.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
txtAccountName.Text = xrm.Page.data.entity.attributes.get("name").getValue();
}
private void btnSetData_Click(object sender, RoutedEventArgs e)
{
//Update Account Name attribute on the form with value from textbox.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
xrm.Page.data.entity.attributes.get("name").setValue(txtAccountName.Text);
}
private void btnSaveData_Click(object sender, RoutedEventArgs e)
{
//Fire Save method to commit form changes.
dynamic xrm = (ScriptObject)HtmlPage.Window.GetProperty("Xrm");
xrm.Page.data.entity.save();
}
}
}
f. Click Build|Build Solution. If everything is correct you will see it say Build Succeeded at the bottom of the Visual Studio Window.
Image may be NSFW.
Clik here to view.
5. Create the Silverlight Web Resource.
a. Log into the CRM Website and navigate to Settings | Customizations | Customize the System.
b. In the Solution Window Click Web Resources from the Components list on the left hand navigation.
c. Click New.
d. Populate the new Web Resource information.
Name: /ClientBin/SilverlightAccountPage.xap
Display Name: Silverlight Account Page
Description: Silverlight Application that interacts with Account Form.
Type: Silverlight (XAP)
Language: English
Image may be NSFW.
Clik here to view.
e. Click Save.
f. Click the Browse Button and select the XAP file that was built within Visual Studio. Path may be similar to the following.
i.e. C:\Users\<UserName>\Documents\Visual Studio 2010\Projects\Silverlight
AccountPage.Web\ClientBin.
g. Save the Web Resource.
6. Add Silverlight Web Resource to the Account Form.
a. Log into the CRM Website and navigate to Settings | Customizations | Customize the System.
b. In the Solution Window Expand Entities from the Components list on the left hand navigation.
c. Expand Account from within the Entities List.
d. Select Forms and Open the Main Form.
e. Click the Insert Tab at the top of the form and choose Web Resource.
f. Use the lookup to select the Silverlight web resource that we created in Step 5.
Image may be NSFW.
Clik here to view.
g. Enter a Name and Label for the Web Resource and Click OK.
Image may be NSFW.
Clik here to view.
h. Click Save on the Account Form.
i. Click Publish on the Account Form.
j. Open an Existing Account record from the Account view. The Silverlight web resource will be displayed once the Account Form opens.
Image may be NSFW.
Clik here to view.
k. Change the Account name within the web resource textbox and click Set Data. The new name will be reflected on the form.
Image may be NSFW.
Clik here to view.
l. Click the Save Data button and this will commit the change and refresh the form.
You can find more information regarding related services we provide here.