Kadir Geylan Selçuk – Designer, Developer and Gamer | How to Bind Data and Load Comboboxes / Dropdownlists in Microsoft CRM using Javascript and AJAX

How to Bind Data and Load Comboboxes / Dropdownlists in Microsoft CRM using Javascript and AJAX

Jul 20, 09 • Javascript, Microsoft .NET, Microsoft Dynamics CRM, SQL, Tutorial • No Comments • Read More »

Let’s say you have two tables that include towns and cities and you also have two fields in an entity that you have to keep the town and city of customer address. All you want to do is to load towns that are valid for the selected city only.

Below you will find how to do it in an aspx page and you can easily convert it for CRM Forms. If we explain the process; we have a drowdownlist which has a function called FillTowns() that gets an XML result from GetTowns.aspx page using the ID of selected city in combobox. The returned XML has a table called “result” and two columns called “townid” and “townname” which of course will be used for value and text of our combobox options. If we get an error returned, we will just alert it. Else, we will delete all of the options of the town combobox and reload it. That’s it.

Here is the code so you can convert it for your own aspx pages and CRM Forms.

Note: You can get towns and cities from “Stringmap” table in CRM but you need to get the relationship between Cities and Towns from another table you create.

<body>
    <form runat="server">
    <div>
        <asp:DropDownList runat="server">
        </asp:DropDownList>
        <asp:DropDownList runat="server">
        </asp:DropDownList>
    </div>
    </form>
    <script>
    function FillTowns()
        {
            document.getElementById("<%=Me.cmbTowns.ClientID %>").options.length = 0;
            var oXmlDoc;
            if (window.ActiveXObject)   // ActiveX version
            {
                oXmlDoc = new ActiveXObject("Microsoft.XMLDOM");  // Internet Explorer
            }
            else
            if (window.XMLHttpRequest)     // Object of the current windows
            {
                oXmlDoc = new XMLHttpRequest();     // Firefox, Safari, ...
            } 
            oXmlDoc.async = false;
            oXmlDoc.load("GetTowns.aspx?CityId=" + document.getElementById("<%=Me.cmbCities.ClientID %>").value );     
            var Error= oXmlDoc.selectSingleNode("error");
            if (!IsNull(Error))
            {
                alert(Error.text);
            }  else
            {
                var TownIds = oXmlDoc.selectNodes("result/townid");
                var TownNames = oXmlDoc.selectNodes("result/townname");
                for (i=0; i< TownIds.length; i++)
                {
                    var oOption = document.createElement("option");
                    oOption.value=TownIds(i).text;
                    oOption.text=TownNames(i).text;
                    document.getElementById('<%= Me.cmbTowns.ClientID%>').add(oOption);
                }               
                if (TownIds.Length > 0)
                {
                    document.getElementById('<%= Me.cmbTowns.ClientID%>').options[0].selected = true;
                }
            }
        }

        function IsNull(o)
        {
            return ("undefined" == typeof(o) || "unknown" == typeof(o) || null == o)
        }
    </script>
</body>

Popularity: 33% [?]

Tags: AJAX, Combobox, CRM, Dropdownlist, Javascript, Microsoft, XML