JSFiddle - React, Tailwind, and code Playground

by NesterOne

HTML

<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.min.css">
<script type='text/javascript' src="http://visualizejs-preview.eng.jaspersoft.com:8080/client/visualize.js"></script>


<ul class="nav nav-pills">
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#">Profile</a></li>
  <li><a href="#">Messages</a></li>
    <li><button id="test">Load IC</button></li>
</ul>

    
    

<div id="container"></div>

<div id="report"></div>

CSS

#container {
    width:200px;
}

JavaScript

visualize({
    auth: {
        name: "superuser",
        password: "superuser"
    }
}, function (v) {
    $("#test").click(function(){
        v.inputControls({
        container: "#container",
        resource: "/public/Samples/Reports/16g.InteractiveSalesReport",
        error: function (err) {
            alert(err);
        },
        events: {
            change : function(params) {
                v("#report").report({
                            resource: "/public/Samples/Reports/16g.InteractiveSalesReport",
                            params: params
                        });
            }
        }
    });
    });
    
    
});