1 Reply Latest reply: Mar 4, 2014 11:05 AM by Mikael Gerhardsson RSS

    Editing my script around

    Kevin Maroney Feb 28, 2014 10:50 AM

      I have taken a javascript file and am starting to implement it into a Qlikview Extension. For now I have a bulk of the styling script commented out and it is working but I was wondering what is a way to get this part of the script back in. I have imported all of the different styling sheets into the extension as well. It looks to me that this part of the script is HTML which I would guess is a problem.  I only have a very basic Java/HTML background so any help would be appreciated.

       

      /*<style>

      body {

        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

        margin: auto;

        position: relative;

        width: 960px;

      }

      text {

        font: 10px sans-serif;

      }

      .axis path,

      .axis line {

        fill: none;

        stroke: #000;

        shape-rendering: crispEdges;

      }

      form {

        position: absolute;

        right: 10px;

        top: 10px;

      }

      </style>

      <form>

        <label><input type="radio" name="mode" value="grouped"> Grouped</label>

        <label><input type="radio" name="mode" value="stacked" checked> Stacked</label>

      </form>

      <script src="http://d3js.org/d3.v3.min.js"></script>

      <script>

      */

      • 266 Views
      • Tags:
        • Re: Editing my script around
          Mikael Gerhardsson
          Mikael Gerhardsson Mar 4, 2014 11:05 AM (in response to Kevin Maroney )

          I am not sure if this is what you want...

           

          Create a separate css-file and import it into your extension object (in script.js):

           

          var path = Qva.Remote + "?public=only&name=Extensions/<ObjectName>/";
Qva.LoadCSS(path + <CSS-file>.css);

           

          In this css file you can add everything within the <style> tags:

           

          body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: auto;
  position: relative;
  width: 960px;
}
text {
  font: 10px sans-serif;
}
.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}
form {
  position: absolute;
  right: 10px;
  top: 10px;
}

           

          The remaining html syntax can probably be written in script.js something like:

           

          var HTML += "<form>";
HTML += "<label><input type='radio' name='mode' value='grouped'> Grouped</label>";
HTML += "<label><input type='radio' name='mode' value='stacked' checked> Stacked</label>";
HTML += "</form>";

           

          Use the variable HTML as:

           

          _this.Element.innerHTML = HTML;