Visualize: render input controls

All types

HTML

<script type='text/javascript' src="http://localhost:8080/jasperserver-pro/client/visualize.js?_opt=false"></script>

<script type='text/javascript' src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<button id="validate">
Validate
</button>
<button id="getParams">
Get Params
</button>
<button id="run">
Run
</button>
<button id="reset">
Reset
</button>
<div id="containerInput" style="width:300px; padding: 10px;"></div>

JavaScript

var inputControls="";
visualize({
  auth: {
    name: "superuser",
    password: "superuser"
  }
}, function(v) {
   inputControls= v.inputControls({
    resource: "/public/Controls/AllAccounts",
    container: "#containerInput",
    error: function(err) {
      console.error(err);
    },
    success: function(data) {
      console.log(data)
    },
    events: {
    change: function(data) {
    	console.log("change: ", data)
    }
    }
  });

$("#validate").click(
function(){
  inputControls.validate();
}
);

$("#getParams").click(
function(){
  console.log(inputControls.params());
}
);
$("#run").click(
function(){
console.log(inputControls.data().parameters)
  inputControls.run(null, function(e) {
    console.log(e)
  });
}
);

$("#reset").click(
  function(){
    console.log("Params before reset: ", inputControls.data().parameters)
      inputControls.reset(function() {
        console.log("Params after: ", inputControls.data().parameters)
      }, function(e) {
        console.log(e)
      });
    }
  );

});