locked
CSS reference into HTML doesn't reflect RRS feed

  • Question

  • I have CSS Web resource with below configuration.

    Name:-  Prefix_Name.css
    DisplayName:- Name.css
    URL:-  http://url/Prefix_Name.css

    when I use below line in html web resource, it doesn't relect the css font/size/other gui??

    <link href="css/Prefix_Name.css" rel="stylesheet" type="text/css" />

     So some how, HTML doesn't able to refer css at all?? I tried few VS 2012 package approach and also tried few path,. but doesn't work.  Any idea, how to refer the css correctly here??

    Thanks,

    Nick

    Tuesday, April 22, 2014 9:08 PM

Answers

  • Hi,

        You can use following function to load any other web resource including css file.


    function LoadWebResource(resource) {
        var httpRequest = null;
        try {   
            if (window.XMLHttpRequest) {  // code for IE7+, Firefox, Chrome, Opera, Safari
                httpRequest = new XMLHttpRequest();
            }
            else {  // code for IE6, IE5
                httpRequest = new ActiveXObject('Microsoft.XMLHTTP');
                }

            var serverUrl= Xrm.Page.context.getClientUrl();
            if (serverUrl.match(/\/$/)) {
                serverUrl = serverUrl.substring(0, serverUrl.length–1);
            }
     
            httpRequest.open('GET', serverUrl + '/webresources/' + resource, false);
            httpRequest.send(null);
            eval(httpRequest.responseText);
        }
        catch (e) {
            alert('LoadWebResource >> Error loading ' + resource + ':\n' + e.description);
       }
    }

    function Form_onload() {
        LoadWebResource('Prefix_name.css');

    }


    Hope this helps.
     
    -----------------------------------------------------------------------
     Minal Dahiya
    blog : http://minaldahiya.blogspot.com.au/

     
    If this post answers your question, please click "Mark As Answer" on the post and "Vote as Helpful"

    • Proposed as answer by Minal Dahiya Tuesday, April 22, 2014 11:01 PM
    • Unproposed as answer by Nicksoft2011 Wednesday, April 23, 2014 12:51 PM
    • Marked as answer by Nicksoft2011 Wednesday, April 23, 2014 1:53 PM
    Tuesday, April 22, 2014 11:01 PM
  • Yes, finally..I worked out.

    I did manual html/css test outside of crm and then replicate same scenario for referring html/css into CRM and it did work.

    The reference was pretty much the same, just changed few basic thing in location of link/title/scripts into html header and removed unnecessary characters/tags.

    The way I found the path of CSS in CRM, is I run the CRM Page into Chrome browser and go to F12 and check Source section, which showed me the exact location and then I manually open that web Resource into browser and found the path. It turn out that the path is prefix_sample.css.

    Thanks Minal for your quick feedback.

    • Marked as answer by Nicksoft2011 Wednesday, April 23, 2014 1:58 PM
    Wednesday, April 23, 2014 1:58 PM

All replies

  • Hi,

        You can use following function to load any other web resource including css file.


    function LoadWebResource(resource) {
        var httpRequest = null;
        try {   
            if (window.XMLHttpRequest) {  // code for IE7+, Firefox, Chrome, Opera, Safari
                httpRequest = new XMLHttpRequest();
            }
            else {  // code for IE6, IE5
                httpRequest = new ActiveXObject('Microsoft.XMLHTTP');
                }

            var serverUrl= Xrm.Page.context.getClientUrl();
            if (serverUrl.match(/\/$/)) {
                serverUrl = serverUrl.substring(0, serverUrl.length–1);
            }
     
            httpRequest.open('GET', serverUrl + '/webresources/' + resource, false);
            httpRequest.send(null);
            eval(httpRequest.responseText);
        }
        catch (e) {
            alert('LoadWebResource >> Error loading ' + resource + ':\n' + e.description);
       }
    }

    function Form_onload() {
        LoadWebResource('Prefix_name.css');

    }


    Hope this helps.
     
    -----------------------------------------------------------------------
     Minal Dahiya
    blog : http://minaldahiya.blogspot.com.au/

     
    If this post answers your question, please click "Mark As Answer" on the post and "Vote as Helpful"

    • Proposed as answer by Minal Dahiya Tuesday, April 22, 2014 11:01 PM
    • Unproposed as answer by Nicksoft2011 Wednesday, April 23, 2014 12:51 PM
    • Marked as answer by Nicksoft2011 Wednesday, April 23, 2014 1:53 PM
    Tuesday, April 22, 2014 11:01 PM
  • Minal,

           Thanks for the update. But loading the web resource work fine. if I go to F12 in browser, I can see it is loaded correctly. its under prefix_/css/sample.css. I am using the same path on html link section

     <link href="prefix_/css/sample.css" rel="stylesheet" type="text/css"/>

    Some how css doesn't take effect into that html resource when html gets displayed.

    Any idea , what could be wrong??

    Thanks,

    Nick

    Wednesday, April 23, 2014 12:50 PM
  • Yes, finally..I worked out.

    I did manual html/css test outside of crm and then replicate same scenario for referring html/css into CRM and it did work.

    The reference was pretty much the same, just changed few basic thing in location of link/title/scripts into html header and removed unnecessary characters/tags.

    The way I found the path of CSS in CRM, is I run the CRM Page into Chrome browser and go to F12 and check Source section, which showed me the exact location and then I manually open that web Resource into browser and found the path. It turn out that the path is prefix_sample.css.

    Thanks Minal for your quick feedback.

    • Marked as answer by Nicksoft2011 Wednesday, April 23, 2014 1:58 PM
    Wednesday, April 23, 2014 1:58 PM