Forum Discussion

tomseidel's avatar
tomseidel
Regular Visitor
8 years ago

Custom visual arrange layers of visualization

Hi,

we need a datetime picker as custom visual. One option seemed to be including bootstrap/jquery based external components.

Thats what I tried, but cant get it to work. I used:

"npm install jquery-datetimepicker" and referenced it and a simple external script within pbiviz.json: "assets/js/jscripts.js"

content is just:

 

window.jQuery(function () {
$('#datetimepicker').datetimepicker();
});

 

when I create just a simple text input I got the error-message:

My constructor just adds an input element with that id:

 

this.target = options.element;
this.updateCount = 0;
if (typeof document !== "undefined") {
const new_txt: HTMLElement = document.createElement("input");
new_txt.id = 'datetimepicker';
this.target.appendChild(new_txt);
}

 

how can I get that to work and if so, how do I get the select value back?

 

Thanks for you help,

Thomas

9 Replies

  • v-viig's avatar
    v-viig
    Community Champion

    Did you add jquery-datetimepicker.js into externalJS property of pbiviz.json?

     

    Ignat Vilesov,

    Software Engineer

     

    Microsoft Power BI Custom Visuals

    [email protected]

    • tomseidel's avatar
      tomseidel
      Regular Visitor

      Yes:

       

      "externalJS": [
         "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.js",
         "node_modules/jquery/dist/jquery.min.js",
         "node_modules/jquery-datetimepicker/build/jquery.datetimepicker.full.min.js",
         "assets/js/jscripts.js"
      ],

      • v-viig's avatar
        v-viig
        Community Champion

        Please follow these steps:

        • Create a new JS file
        • Put this code into a new file: var $ = window.jQuery; var jQuery = window.jQuery
        • Add this file into externalJS proeprty of pbiviz.json right after jquery
        • pbiviz start
        • Check if the issue is resolved

        Ignat Vilesov,

        Software Engineer

         

        Microsoft Power BI Custom Visuals

        [email protected]