Creating a Custom Parameter Panel for the Viewer
Our sample projects and report templates can help you learn the basics of working with our products.Instead of the built-in parameter panel, you can build your own HTML form and feed its values to the viewer.
Submitting values. Collect the inputs and post them to the viewer as an interaction:
Driving the viewer. The same client API can trigger built-in actions, for example page navigation:
Submitting values. Collect the inputs and post them to the viewer as an interaction:
function viewerSubmitParameters() {
var params = {
action: "Variables",
variables: {
"Name": document.getElementById("name").value,
"Email": document.getElementById("email").value,
"Sex": document.getElementById("male").checked
}
};
jsStiNetCoreViewer1.postInteraction(params);
}Driving the viewer. The same client API can trigger built-in actions, for example page navigation:
<button onclick="jsStiNetCoreViewer1.postAction('FirstPage')">First Page</button>
<button onclick="jsStiNetCoreViewer1.postAction('PrevPage')">Prev Page</button>postInteraction sends your variables to the server (where the report is re-rendered with them), while postAction invokes standard viewer commands — together they let you replace the default parameter panel with a fully custom interface.