Home Library Learn Downloads Support Community
Sign in | United States - English | |
This topic has not yet been rated - Rate this topic

Sample: Pass Multiple Values to a Web Resource Through the Data Parameter

A Web page (HTML) or Silverlight Web resource page can only accept a single custom parameter called data. To pass more than one value within the data parameter, you need to encode the parameters and decode the parameters within your page.

The page below represents a technique to pass the additional values within a single parameter and then process them within your Web resource. This page is available in the downloadable files for the SDK at sdk\samplecode\js\webresources\showdataparams.htm

Sample HTML Web Resource

The HTML code below represents a Web page (HTML) Web resource that includes a script that defines three functions:

  • getDataParam: Called from the body.onload event, this function retrieves any query string parameters passed to the page and locates one named data.

  • parseDataValue: Receives the data parameter from getDataParam and builds a DHTML table to display any values passed within the data parameter.

    noteNote
    All characters included in the query string will be encoded using the encodeURIComponent method. This function uses the JScriptdecodeURIComponent method to decode the values passed.

  • noParams: Displays a message when no parameters are passed to the page.

HTML
Copy 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Show Data Parameters Page</title>
<style type="text/css">body{font-family: Segoe UI, Tahoma, Arial;
background-color: #d6e8ff;}tbody{background-color: white;}th{
background-color: black;color: White;}</style>

    <script language="jscript" type="text/jscript">
        function getDataParam()
        {   //Get the any query string parameters and load them
            //into the vals array

            var vals = new Array();
            if (location.search != "")
            {
                vals = location.search.substr(1).split("&");
                for (var i in vals)
                {
                    vals[i] = vals[i].replace(/\+/g, " ").split("=");
                }
                //look for the parameter named 'data'
                var found = false;
                for (var i in vals)
                {
                    if (vals[i][0].toLowerCase() == "data")
                    {
                        parseDataValue(vals[i][1]);
                        found = true;
                        break;
                    }
                }
                if (!found)
                { noParams(); }
            }
            else
            {
                noParams();
            }
        }

        function parseDataValue(datavalue)
        {
            if (datavalue != "")
            {
                var vals = new Array();

                var message = document.createElement("p");
message.innerText = "These are the data parameters values that were passed to this page:";
                document.body.appendChild(message);

                vals = decodeURIComponent(datavalue).split("&");
                for (var i in vals)
                {
                    vals[i] = vals[i].replace(/\+/g, " ").split("=");
                }

                //Create a table and header using the DOM
                var oTable = document.createElement("table");
                var oTHead = document.createElement("thead");
                var oTHeadTR = document.createElement("tr");
                var oTHeadTRTH1 = document.createElement("th");
                oTHeadTRTH1.innerText = "Parameter";
                var oTHeadTRTH2 = document.createElement("th");
                oTHeadTRTH2.innerText = "Value";
                oTHeadTR.appendChild(oTHeadTRTH1);
                oTHeadTR.appendChild(oTHeadTRTH2);
                oTHead.appendChild(oTHeadTR);
                oTable.appendChild(oTHead);
                var oTBody = document.createElement("tbody");
                //Loop through vals and create rows for the table
                for (var i in vals)
                {
                    var oTRow = document.createElement("tr");
                    var oTRowTD1 = document.createElement("td");
                    oTRowTD1.innerText = vals[i][0];
                    var oTRowTD2 = document.createElement("td");
                    oTRowTD2.innerText = vals[i][1];

                    oTRow.appendChild(oTRowTD1);
                    oTRow.appendChild(oTRowTD2);
                    oTBody.appendChild(oTRow);
                }

                oTable.appendChild(oTBody);
                document.body.appendChild(oTable);
            }
            else
            {
                noParams();
            }
        }

        function noParams()
        {
            var message = document.createElement("p");
message.innerText = "No data parameter was passed to this page";

            document.body.appendChild(message);
        }
    </script>

</head>
<body onload="getDataParam();">
</body>
</html>

Using this page

  1. Create a Web page Web resource called "new_/ShowDataParams.htm" using the sample code.

    The parameters you want to pass are: first=First Value&second=Second Value&third=Third Value

    noteNote
    If you are adding static parameters using the Web Resource Properties dialog from the form editor, you can simply paste the parameters without encoding them into the Custom Parameter(data) field. These values will be encoded for you, but you will still need to decode them and extract the values in your page.

  2. For dynamic values generated in code, use the encodeURIComponent method on the parameters. The encoded values should be:

    first%3DFirst%20Value%26second%3DSecond%20Value%26third%3DThird%20Value

    Open the page passing the encoded parameters as the value of the data parameter:

    Copy 
    http://<server name>/WebResources/new_/ShowDataParams.htm?Data=first%3DFirst%20Value%26second%3DSecond%20Value%26third%3DThird%20Value
    noteNote
    If you have added the Web resource to a form and have pasted the un-encoded parameters into the Custom Parameters(data) field, you can just preview the form.

  3. The new_/ShowDataParams.htm will display a dynamically generated table:

     

    Parameter Value

    first

    First Value

    second

    Second Value

    third

    Third Value

How it works

To access the values embedded within the data query string parameter value, in your Web page Web resource you can extract the value of the data parameter and then use code to split the string into an array so you can access each name value pair individually.

When the page loads the getDataParam function is called. This function simply identifies the data parameter and passes the value to the ParseDataValue function. If no data parameter is found the noParams function will add a message to the page in place of the table.

The ParseDataValue function uses similar logic found in getDataParam to locate the custom parameter delimiters to create an array of name value pairs. Then it generates a table and appends it to the otherwise empty document.body.

See Also

Microsoft Dynamics CRM 2011 and Microsoft Dynamics CRM Online
Send comments about this topic to Microsoft.
© 2012 Microsoft Corporation. All rights reserved.
Did you find this helpful?
(1500 characters remaining)
Community Content Add
Annotations FAQ
Silverlight HtmlPage.Document.QueryString["Parameter"] does not work

I have a Silverlight 4 Control which should receive Custom Parameter(Data) from the Web Resource Properties config dialog.
I've put a parameter like: SchemaId=Test77

I try to access this HTML-Query-Parameter without decoding in JavaScript from inside Silverlight with:
HtmlPage.Document.QueryString["SchemaId"]

It does not work.
What did I do wrong?

Jim Daly - See the response to your other question.

History
How to pass Parameters to Silverlight?

Also the following does not work.
It stems from http://msdn.microsoft.com/en-us/library/gg328358.aspx

App.Current.Host.InitParams["SchemaId"];

Question: how to pass parameters to silverlight?

For a faster reply to questions, you should use the 'Send comments about this topic to Microsoft." link above or post a question on a the crm development forum at http://social.microsoft.com/Forums/en-US/crmdevelopment/threads

The Community Content feature allows you to share content. Not the best place to get answers to questions.

To answer your question I verified using the following:

A new Silverlight 4 Application Project with the following files:

MainPage.xaml:
<UserControl x:Class="PassParamsTest.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">



    <Grid x:Name="LayoutRoot" Background="White">

        <TextBlock x:Name="textBlock1"

                   Height="23"

                   HorizontalAlignment="Center"

                   Margin="0,0,0,0"

                   Text="TextBlock"

                   VerticalAlignment="Center" />

    </Grid>

</UserControl>

MainPage.xaml.cs:
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;



namespace PassParamsTest

{

public partial class MainPage : UserControl

{

  public MainPage()

  {

   InitializeComponent();

   string dataPassed = null;

   try

   { dataPassed = App.Current.Host.InitParams["data"]; }

   catch (SystemException se)

   { }

   

   

   if (dataPassed != null)

   { textBlock1.Text = dataPassed; }

   else

   { textBlock1.Text = "Nothing Passed"; }

  }

}

}
Then I built the project and created a web resource with the XAP file.I added the silverlight web resource to an entity form and set text in the Web Resource Properties dialog > General Tab > Web Resource Properties section > Custom Parameter(data) textbox.

When the form loads, the text in the textBlock1 displays the text specified.

I hope this helps.

History