4. Showing the list of Products

Occasionally we may want to show the list of Products attached to a Opportunity, Quote, Order or Invoice directly from the General Tab of the form – this allows a more quick-fire process for adding new Products or viewing the list of Products.

Opportunity form in MSCRM showing the list of Opportunity Products directly from the General Tab

Opportunity form in MSCRM showing the list of Opportunity Products directly from the General Tab

This can then be implemented via a simple piece of onLoad Javascript:

// Show Opportunity Products
var frameProducts = 'IFRAME_Products';
var objFrame;

objFrame = document.getElementById(frameProducts);
objFrame.allowTransparency = true;

var navProductsId = "navProducts";

if (document.getElementById(navProductsId) != null) {
    var eventNavOnclick = document.getElementById(navProductsId).onclick.toString();
    eventNavOnclick = eventNavOnclick.substring(eventNavOnclick.indexOf("'") + 1, eventNavOnclick.indexOf(";"));

    var loadArea = eventNavOnclick.substring(0, eventNavOnclick.indexOf("'"));

    if (eventNavOnclick.indexOf("roleOrd") == -1) {
        crmForm.all.IFRAME_Products.src = GetFrameSrc(loadArea)
    }
    else {
        crmForm.all.IFRAME_Products.src = GetFrameSrc(loadArea) + "&" + eventNavOnclick.substring(eventNavOnclick.indexOf("roleOrd"), eventNavOnclick.lastIndexOf("'")).replace("\\x3d", "="); ;
    }    
}

function GetFrameSrc(tabSet) {
    if (crmForm.ObjectId != null) {
        var id = crmForm.ObjectId;
        var type = crmForm.ObjectTypeCode;
        var security = crmFormSubmit.crmFormSubmitSecurity.value;
        var path = document.location.pathname.substring(0, document.location.pathname.indexOf("edit.aspx")) + "areas.aspx?";

        return (path + "oId=" + id + "&oType=" + type + "&security=" + security + "&tabSet=" + tabSet);
    }
    else {
        return "about:blank";
    }
}

This piece of scripting can be duplicated for the Opportunity, Quote, Order or Invoice with a simple change to the highlighted line above – such that the ‘var navProductsId’ line is changed to ‘navExistingProducts’ instead of ‘navProducts’ to show the Existing Products Nav Area on the General Tab.

This technique can then be used to show any Nav Area in MSCRM on the General (or other) Tab by looking at the Page Source for a MSCRM Page by hitting CTRL+N in Internet Explorer and then opening the Page Menu to examine the Page Source – from the list of Page HTML that MSCRM has generated for the page, we can perform a Find to search the HTML to find the Nav Area we wish to display and the name/id of this Nav Area to use in the Java Script.

Viewing the Page HTML of the Opportunity Form in MSCRM to determine the Nav Area id for the Products area

Viewing the Page HTML of the Opportunity Form in MSCRM to determine the Nav Area id for the Products area

By doing this, we can include different Nav Bar Areas on the foremost MSCRM Form Tab to improve the user experience for different areas of the solution:

Showing a different type of associated items using the same script technique

Showing a different type of associated items using the same script technique

I believe this will be standard functionality in the next version (v5) of MSCRM without the need for custom form scripting.

3 Responses to 4. Showing the list of Products

  1. kumar says:

    how we can limit the creation of each particluar related opportunity product in that i frame.

    • In terms of limited which Opportunity Products are converted to Order Products when the Opportunity is taken to an Order?

      Unfortunately CRM either recreates all the Products in the Order, or none of the Products in the Order – which can be problematic for say having multiple Invoices for an Order where each Invoice only invoices certain products and not the whole Order.

      The best method is to manually delete the unwanted products after the Order or Invoice has been created from the Opportunity.

      However if you wanted to automate this, you could add a YES/NO field to the Opportunity Product entity and a Plugin in the Child Pipeline which would trigger on the PreCreate of a Order Product or Invoice Product entity and block the creation based on whether the YES/NO field on the originating Opportunity Product was set to YES – this would work but be a bit fiddly to develope.

  2. patch6096 says:

    Hi,

    Thanks for your incredibly informative walkthrough!

    However, I’ve come across a little issue (user error)… I accidentally removed the “opportunity products” list from my form, and have no idea how to get it back… Any ideas?

    Thanks very much!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s