We are celebrating the 10-year anniversary of the Alteryx Community! Learn more and join in on the fun here.
Start Free Trial

Alteryx Designer Desktop Discussions

Find answers, ask questions, and share expertise about Alteryx Designer Desktop and Intelligence Suite.

html ui sdk

RKSaiyed
5 - Atom

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Request</title>

<!-- Includes the GUI library, which gives you access to the interface elements used in Designer text-align: center;-->
<script type="text/javascript">
document.write('<link rel="import" href="' + window.Alteryx.LibDir + '2/lib/includes.html">');
</script>

<!-- Applies styles to the interface elements you create -->
<style type="text/css">
body {
margin: 15px;


}
#helloCheckBox{
padding-top: 20px;
font-family: "Segoe UI";
}
h1{
margin: 0 0 0 0;
padding: 0;
}

</style>

</head>
<body>
<img src="-logo-290x20px.png">
<br> <br>
<h2>RSAM Automation Request</h2>
<br><br>

<label>USER (SID):</label><input type="text" id="txtUserName" /> <br>
<!-- Creates a check box with an Id so it can be referenced in later code and a label that displays to the user
<div id="DEVSchedularCheckBox" >
<ayx data-ui-props='{type:"CheckBox", widgetId:"DEVSchedularCheckBox", label:"XMSG("DEV Schedular")"}'></ayx>
</div>-->
<div id="UATSchedularCheckBox">
<ayx data-ui-props='{type:"CheckBox", widgetId:"UATSchedularCheckBox", label:"XMSG("UAT Schedular")"}'></ayx>
</div>
<div id="PRODSchedularCheckBox">
<ayx data-ui-props='{type:"CheckBox", widgetId:"PRODSchedularCheckBox", label:"XMSG("PROD Schedular")"}'></ayx>
</div>

<br>
<label>JIRA# :</label><input type="text" id="txtJIRAID" />

<script type="text/javascript">
//
window.Alteryx.Gui.BeforeLoad = function(manager, AlteryxDataItems, json){
var defaultX = 0
/* Creates a new data item that holds the information from the UI element*/

var UATSchedular = new AlteryxDataItems.SimpleBool('UATSchedularCheckBox')
manager.bindDataItemToWidget(UATSchedular, 'UATSchedularCheckBox')

var PRODSchedular = new AlteryxDataItems.SimpleBool('PRODSchedularCheckBox')
manager.bindDataItemToWidget(PRODSchedular, 'PRODSchedularCheckBox')

var UserName = new AlteryxDataItems.SimpleString('txtUserName')
manager.bindDataItemToWidget(UserName, 'txtUserName')

var xDataItem = new AlteryxDataItems.SimpleString('txtJIRAID')
xDataItem.setValue(defaultX)

// Handles data persistence of the value by adding the value to the manager

manager.addDataItem(UATSchedular)
manager.addDataItem(PRODSchedular)
manager.addDataItem(UserName)
manager.addDataItem(xDataItem)

// Updates the value stored in the data item every time the checkbox is clicked

document.getElementById('UATSchedularCheckBox').onclick = function (newCheckBoxValue2) {
UATSchedular.setValue(newCheckBoxValue2.target.value)
}

document.getElementById('PRODSchedularCheckBox').onclick = function (newCheckBoxValue3) {
PRODSchedular.setValue(newCheckBoxValue3.target.value)
}

document.getElementById('txtUserName').onchange = function (newCheckBoxValue4) {
UserName.setValue(newCheckBoxValue4.target.value)
}


}
}

window.Alteryx.Gui.AfterLoad = function(manager,AlteryxDataItems){

var UATSchedular = manager.getDataItem('UATSchedularCheckBox')
document.getElementById('UATSchedularCheckBox').value = UATSchedular.getValue()

var PRODSchedular = manager.getDataItem('PRODSchedularCheckBox')
document.getElementById('PRODSchedularCheckBox').value = PRODSchedular.getValue()

var UserName = manager.getDataItem('txtUserName')
document.getElementById('txtUserName').value = UserName.getValue()



}

window.Alteryx.Gui.Annotation = function(manager){

var UATSchedular = manager.getDataItem('UATSchedularCheckBox')
return UATSchedular.getValue()

var PRODSchedular = manager.getDataItem('PRODSchedularCheckBox')
return PRODSchedular.getValue()

var UserName = manager.getDataItem('txtUserName')
return UserName.getValue()

 

}
</script>
</body>
</html>

0 REPLIES 0
Labels
Top Solution Authors