Thursday, August 18, 2011

Disabling Lookup View Selector via Javascript

Sometimes you need to disable the View Selector after the fact via Javascript. In my case, I needed to add a custom view, set to to default, then disable the view picker. If you try to set the view picker as disabled from the form editor, it'll fail to change to the new view that you specify! Therefore, you *have* to disable it after the fact. Luckily, this can be done with one quick & effective line:

document.getElementById("new_product").disableViewPicker = 1;

In my case, new_product is the name of the lookup that I wanted to disable views for. In the bigger context, here is a working example of how to create a custom view then disable the view selector:


var viewId = "{00000000-0000-0000-0000-000000000001}";
    var entityName = "new_quoteproduct";
    var viewDisplayName = "Filtered Products";
    var viewIsDefault = true;

    fetchXml = "<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
                   "<entity name='new_quoteproduct'>" +
                   "<attribute name='new_quoteproductid' />" +
                   "<attribute name='new_name' />" +
                   "<attribute name='new_category' />" +
                   "<attribute name='new_systemset' />" +
                   "<attribute name='new_productnumber' />" +
                   "<order attribute='new_category' descending='false' />" +
                   "<filter type='and'>" +
                   "<condition attribute='statecode' operator='eq' value='0' />";
    if (systemSet) {
        fetchXml += "<condition attribute='new_systemset' operator='eq' value='100000002' />";
    }
    if(categoryID != null) {
        fetchXml += "<condition attribute='new_category' operator='eq' value='" + categoryID + "' />";
    }
    fetchXml += "</filter>" +
                "</entity>" +
                "</fetch>";

    var layoutXml = "<grid name='resultset' object='1' jump='new_name' select='1' icon='1' preview='1'>" +
                    "<row name='result' id='new_quoteproductid'>" +
                    "<cell name='new_category' width='150' />" +
                    "<cell name='new_productnumber' width='150' />" +
                    "<cell name='new_systemset' width='75' />" +
                    "<cell name='new_name' width='200' />" +
                    "</row>" +
                    "</grid>";

    Xrm.Page.getControl("new_product").addCustomView(viewId, entityName, viewDisplayName, fetchXml, layoutXml, viewIsDefault);
    document.getElementById("new_product").disableViewPicker = 1;


Now, if only MS would fix the bug where custom lookup views don't respect your sorting, and we'd have a perfect solution! Hopefully this helps some of you out there.

7 comments:

  1. Nice, exactly what I was looking for.
    Now its only time Microsoft closes these Gaps in the JavaScript API

    ReplyDelete
  2. Just what I was looking for as well. Is this a supported mechanism though?

    ReplyDelete
  3. The way I see it, if we're going through the DOM directly, its probably unsupported :). If MS changes the way that they disable the view picker internally, it'll break. MS will probably give us an actual XRM call in the future to do this, but the underlying mechanism is unlikely to change.

    ReplyDelete
  4. Excellent job Steve. This is what i'm really looking from morning.
    A small suggestion : It would be very nice and more informative for new bees, if you comment the code where ever possible.

    can you tell me what is the job of "LayoutXML", I didn't get this point. If possible, plese reply to me @ ansrikanth@gmail.com

    ReplyDelete
  5. Thanks! Code commenting has always been my weak-point - I generally try to have self-documenting code, but that is not always the case!

    The LayoutXML is used for providing the visualization of the custom view that we defined in the FetchXML above. This particular layout has 4 columns of varying widths. When the view is used, it will be called "Filtered Products" and have those 4 columns in it.

    Hopefully that answers your question! I realize now that I actually have two examples in this code - the first example shows how to load a custom view via FetchXML and LayoutXML, while the second example shows how to disable the view picker once the custom view is established.

    ReplyDelete
  6. Thanks man! you saved me hours of stress!

    ReplyDelete