Customer Engagement & Dynamics CRM Forum

Expand all | Collapse all

Modal Forms with Release Wave 1

  • 1.  Modal Forms with Release Wave 1

    SILVER CONTRIBUTOR
    Posted Feb 20, 2020 09:05 AM
    Hello Everyone!

    I was wondering if anyone has had any luck implementing the navigateTo API call for modal forms yet? I have a use case where this functionality would be great but am not exactly sure on how to properly trigger the event. I am hoping that i can add this functionality to when a user clicks "new" in a subgrid or double clicks an existing record in the subgrid. From my understanding of the documentation this should be possible but im not sure how to get the onclick registered from a native button on the subgrid...

    Thanks for any help or direction!

    ------------------------------
    Erik Seitz
    RJ Corman Railroad Group, LLC
    Nicholasville KY
    ------------------------------


  • 2.  RE: Modal Forms with Release Wave 1

    SILVER CONTRIBUTOR
    Posted Feb 20, 2020 09:36 AM
    Edited by Jay Buddhdev Feb 20, 2020 09:50 AM
    Hi Erik,

    Yes I have tried this new navigateTo API and it seems to be working fine. Here is the sample code that I have used:
    var qs = "param1=1&param2=2"; 
    var pageInput = { 
        pageType: "webresource", 
        webresourceName: "NameOfWebResource", 
        data: encodeURIComponent(qs) 
    }; 
    var navigationOptions = { 
        target: 2, // 2 is for opening the page as a dialog. 
        width: 400, // default is px. can be specified in % as well. 
        height: 300, // default is px. can be specified in % as well. 
        position: 1 // 1 to open the dialog in center. Default is 1 (center). 
    }; 
    Xrm.Navigation.navigateTo(pageInput, navigationOptions).then( 
        function success() { 
            debugger; 
        }, 
        function error(e) { 
            // Handle errors 
        } 
    );

    If you are looking to implement it in the side pane (like QuickCreate) just change the position from 1 to 2:
    var qs = "param1=1&param2=2"; 
    var pageInput = { 
        pageType: "webresource", 
        webresourceName: "NameOfWebResource", 
        data: encodeURIComponent(qs) 
    }; 
    var navigationOptions = { 
        target: 2, // 2 is for opening the page as a dialog. 
        width: 400, // default is px. can be specified in % as well. 
        height: 300, // default is px. can be specified in % as well. 
        position: 2 // 2 to open the dialog on the side. Default is 1 (center). 
    }; 
    Xrm.Navigation.navigateTo(pageInput, navigationOptions).then( 
        function success() { 
            debugger; 
        }, 
        function error(e) { 
            // Handle errors 
        } 
    );​

    Code Reference: https://debajmecrm.com/2019/11/27/open-webresources-modal-or-inline-using-xrm-naviagtion-naviagteto-in-dynamics-365-unified-interface/

    Please let me know if you have any questions/concerns.

    Thanks
    Jay

    ------------------------------
    JayBuddhdev
    https://www.powerappsd365.com
    Regina SK Canada
    ------------------------------



  • 3.  RE: Modal Forms with Release Wave 1

    TOP CONTRIBUTOR
    Posted Feb 20, 2020 09:42 AM
    Jay,
    Did you try the code or you took the code from someone's blog post - https://debajmecrm.com/2019/11/27/open-webresources-modal-or-inline-using-xrm-naviagtion-naviagteto-in-dynamics-365-unified-interface/ because your example looks exactly the same like an example from the blog post.

    ------------------------------
    Andrew Butenko
    ------------------------------



  • 4.  RE: Modal Forms with Release Wave 1

    SILVER CONTRIBUTOR
    Posted Feb 20, 2020 09:49 AM
    Andrew,

    I did tried the code bymyself. I have used the code from the blog that you have mentioned. Sorry I forgot to add reference to it, thank you for reminding.

    ------------------------------
    JayBuddhdev
    https://www.powerappsd365.com
    Regina SK Canada
    ------------------------------



  • 5.  RE: Modal Forms with Release Wave 1

    TOP CONTRIBUTOR
    Posted Feb 20, 2020 09:50 AM
    Jay,
    No worries. I just was curious.

    ------------------------------
    Andrew Butenko
    ------------------------------



  • 6.  RE: Modal Forms with Release Wave 1

    GOLD CONTRIBUTOR
    Posted Feb 21, 2020 10:09 AM
    Have avoided using javascript where possible but this sounds like it might be useful. How is this script bound to individual lookup fields?

    ------------------------------
    Pete Axtell
    Winton
    ------------------------------



  • 7.  RE: Modal Forms with Release Wave 1

    TOP CONTRIBUTOR
    Posted Feb 21, 2020 11:40 AM
    Pete,
    You can't bind this script to lookup fields but you can call this script on some actions - let's say on the field change or form load.

    ------------------------------
    Andrew Butenko
    ------------------------------



  • 8.  RE: Modal Forms with Release Wave 1

    GOLD CONTRIBUTOR
    Posted 27 days ago
    Thanks. This is what I was looking for: https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/reference/events/onlookuptagclick

    ------------------------------
    Pete Axtell
    Winton
    ------------------------------



  • 9.  RE: Modal Forms with Release Wave 1

    SILVER CONTRIBUTOR
    Posted Feb 21, 2020 01:37 PM
    Hi Pete,

    You can call this JavaScript function on Change event. This code will also make sure that it will work only if there is any value inside the LookupField.
    function LookUpChange (executionContext) {
        'use strict';
        var formContext = executionContext.getFormContext();
        var LookupField = formContext.getAttribute("TargetedLookupFieldName").getValue();
        if(LookupField){
            console.log("Function is loaded");
            var qs = "param1=1&param2=2";
            var pageInput = {
                pageType: "webresource",
                webresourceName: "WebResourceName",
                data: encodeURIComponent(qs)
            };
            console.log(pageInput.webresourceName);
            var navigationOptions = {
                target: 2, // 2 is for opening the page as a dialog. 
                width: 400, // default is px. can be specified in % as well. 
                height: 300, // default is px. can be specified in % as well. 
                position: 1 // Specify 1 to open the dialog in center; 2 to open the dialog on the side. Default is 1 (center). 
            };
            Xrm.Navigation.navigateTo(pageInput, navigationOptions).then(
                function success() {
                    debugger;
                },
                function error(e) {
                    // Handle errors 
                }
            );
        }
    }

    To register this event, open the form properties add the web resource to the event library and then add this event handler to the field on change event. Here is an example of how I did it:


    I hope this will help. Feel free to ask me if you have any questions/concerns. Also please mark my answer as Best Answer if this is helpful.

    Thanks
    Jay




    ------------------------------
    JayBuddhdev
    https://www.powerappsd365.com
    Regina SK Canada
    ------------------------------



  • 10.  RE: Modal Forms with Release Wave 1

    TOP CONTRIBUTOR
    Posted Feb 20, 2020 09:48 AM
    Erik,
    Check following - https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/customize-entity-forms#open-an-existing-record
    That should give you an example on how to open records in modal dialog.

    ------------------------------
    Andrew Butenko
    ------------------------------



If you've found this thread useful, dive deeper into User Group community content by role