We try to change the ccs style form a field with button.
Goal to switch textbox_1 and textbox_2 from StyleClass 'field tabel' to StyleClass 'field table'.
But all ends with StyleClass 'field tabel'
When run onActionBut1
textbox_1 StyleClass field tabel
textbox_2 StyleClass fiels table
next onActionBut2
textbox_1 StyleClass field tabel
textbox_2 StyleClass fiels tabel
After new launch
When run onActionBut2
textbox_1 StyleClass field table
textbox_2 StyleClass fiels tabel
next onActionBut1
textbox_1 StyleClass field tabel
textbox_2 StyleClass fiels tabel
function onActionBut1(event) {
elements.textbox_1.addStyleClass('field tabel');
elements.textbox_2.addStyleClass('field table');
}
function onActionBut2(event) {
elements.textbox_2.addStyleClass('field tabel');
elements.textbox_1.addStyleClass('field table');
}
/*
// part used css file
.field
{
background-color: #FFFFFF; E1E1E1
border-style: solid;
font: 10px "Verdana";
text-align: left;
margin: 1px 1px 1px 1px;
border-color: #60696E; 60696E
border-width: 1px 1px 1px 1px;
}
.field.table
{
background-color: #FFFFFF; E1E1E1
border-style: solid;
font: 18px "Verdana";
text-align: left;
margin: 2px 0px 2px 0px;
border-color: #60696E; 60696E
border-width: 2px 0px 2px 0px;
}
.field.tabel
{
background-color: #FFFFFF; E1E1E1
border-style: solid;
font: 12px "Verdana";
text-align: left;
margin: 0px 2px 0px 2px;
border-color: #60696E; 60696E
border-width: 0px 2px 0px 2px;
}
.fields
{
background-color: #FFFFFF; E1E1E1
border-style: solid;
font: 10px "Verdana";
text-align: left;
margin: 1px 1px 1px 1px;
border-color: #60696E; 60696E
border-width: 1px 1px 1px 1px;
}*/
/**
* @type {String}
*
* @properties={typeid:35,uuid:"DBFF7466-C396-4BEF-A3B5-87B4EEE669F4"}
*/
var result_2 = 'The Quick Brown Fox';
/**
* @type {String}
*
* @properties={typeid:35,uuid:"EF1E8DA4-1EC7-4E46-A9E7-A6D180D601A8"}
*/
var result_1 = 'dit is een test';
/**
* @param {JSEvent} event
*
* @properties={typeid:24,uuid:"DD275C29-EB1B-4F64-833E-60187E25AFFB"}
*/
function onActionBut1(event) {
elements.textbox_1.addStyleClass('field tabel');
elements.textbox_2.addStyleClass('field table');
}
/**
* @param {JSEvent} event
*
* @properties={typeid:24,uuid:"21D1814B-793B-4DE2-AE5C-1A40F911C563"}
*/
function onActionBut2(event) {
elements.textbox_2.addStyleClass('field tabel');
elements.textbox_1.addStyleClass('field table');
}
/**
* @param {JSEvent} event
*
* @properties={typeid:24,uuid:"BA1A76DB-CC24-4EBF-9E75-13549C121C79"}
*/
function onActionAllert(event) {
plugins.webnotificationsToastr.success('geslaagd', result_1 + new Date() );
}
/**
* @param {JSEvent} event
*
* @properties={typeid:24,uuid:"E93F0C98-8A36-41F4-A778-095B69EB9D61"}
*/
function onActionBut3(event) {
elements.textbox_1.removeStyleClass('fields tabel');
elements.textbox_1.removeStyleClass('fields table');
elements.textbox_2.removeStyleClass('fields tabel');
elements.textbox_2.removeStyleClass('fields table');
}