Visualize.js: Reset Input Controls

Reset embedded JRS Input Controls back to their original state.

by Yuriy Bablyukh

HTML

<script type='text/javascript' src="https://mobiledemo.jaspersoft.com/jasperserver-pro/client/visualize.js"></script>

<!-- JQuery - compiled and minified -->
<script src="https://code.jquery.com/jquery-3.2.1.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">
  <div><p>Loading...</p></div>
</div>

CSS

#containerInput {
    width: 300px
}

/* You can replace the following with your own custom loading indicator */
@import "compass/css3";

@keyframes fadeIn { 
  from { opacity: 0; } 
}

p {
  position: relative;
  top: 50px;
  
  font: italic bold 1.2em/1 Bodoni, serif;
  color: #555;
  text-align: center;
  
  animation: fadeIn 1s infinite alternate;
}

JavaScript

var inputControls="";

visualize({
  auth: {
    name: "joeuser",
    password: "joeuser"
  }
}, function(v) {
   inputControls= v.inputControls({
    resource: "/public/Samples/Reports/ProfitDetailReport",
    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.params())
      inputControls.reset(function(cb) {
        console.log(cb)
      }, function(eb) {
        console.log(eb)
      }, function(al) {
        console.log(a)
      });
    }
  );
});