Facility Control

View Only

Back to discussions

Expand all | Collapse all

Table navigation with add/delete row function

Sam McIntosh15 days ago

Hi I have tried to build a table using code from example panels but am unable to get it working. Essentialy ...

Thomas Wilson13 days ago

Hi Sam, I've had a quick look at your table, and edited the button [ADD COMPETITOR +] and this ...

1. Table navigation with add/delete row function

Recommend

Sam McIntosh

Posted 15 days ago

Hi I have tried to build a table using code from example panels but am unable to get it working.

Essentialy I would like a button to add rows and one to delete rows with up and down arrows to navigate the table.

If someone can assist with what I have wrong that'd be great. Thanks

<abs contexttype="opengear" id="_top" keepalive="false">
   <meta>
      <params>
         <param access="1" maxlength="0" name="Rider Name" oid="riderName" precision="0" type="STRING_ARRAY" widget="default">
            <value>Name 1</value>
            <value>Name 2</value>
            <value>Name 3</value>
            <value>Name 4</value>
            <value>Name 5</value>
         </param>
         <param access="1" maxlength="0" name="Rider Number" oid="riderNumber" precision="0" type="STRING_ARRAY" widget="default">
            <value>1</value>
            <value>2</value>
            <value>3</value>
            <value>4</value>
            <value>5</value>
         </param>
         <param access="1" maxlength="0" name="Country" oid="riderCountry" precision="0" type="STRING_ARRAY" widget="default">
            <value>CAN</value>
            <value>GBR</value>
            <value>GBR</value>
            <value>AUS</value>
            <value>USA</value>
         </param>
         <param access="1" maxlength="0" name="Final Time" oid="riderFinalTime" precision="0" type="STRING_ARRAY" widget="default">
            <value/>
            <value/>
            <value/>
            <value/>
            <value/>
         </param>
         <param access="1" maxlength="0" name="Split 1" oid="riderSplit1" precision="0" type="STRING_ARRAY" widget="default">
            <value/>
            <value/>
            <value/>
            <value/>
            <value/>
         </param>
         <param access="1" maxlength="0" name="Split 2" oid="riderSplit2" precision="0" type="STRING_ARRAY" widget="default">
            <value/>
            <value/>
            <value/>
            <value/>
            <value/>
         </param>
         <param access="1" maxlength="0" name="Split 3" oid="riderSplit3" precision="0" type="STRING_ARRAY" widget="default">
            <value/>
            <value/>
            <value/>
            <value/>
            <value/>
         </param>
         <param access="1" maxlength="0" name="Split 4" oid="riderSplit4" precision="0" type="STRING_ARRAY" widget="default">
            <value/>
            <value/>
            <value/>
            <value/>
            <value/>
         </param>
         <param access="1" constrainttype="STRING_CHOICE" name="params.table" oid="params.table" precision="0" type="INT32" value="0" widget="table">
            <config key="w.selectionparam">Selection</config>
            <constraint>riderName</constraint>
            <constraint>riderNumber</constraint>
            <constraint>riderCountry</constraint>
            <constraint>riderFinalTime</constraint>
            <constraint>riderSplit1</constraint>
            <constraint>riderSplit2</constraint>
            <constraint>riderSplit3</constraint>
            <constraint>riderSplit4</constraint>
         </param>
         <param access="1" constrainttype="INT_NULL" name="Selection" oid="Selection" precision="0" type="INT32" value="4" widget="label"/>
      </params>
      <api>function moveUp()
{
move(-1);
}

function moveDown()
{
move(1);
}

function move(direction)
{
var selection = params.getValue('params.table', 0);
var newSelection = selection + direction;

if (newSelection &lt; 0 || newSelection &gt; params.getElementCount('riderName'))
{
return; //If we are moving up but are already at the top or moving down and are already at the bottom
}

var newValues = [];
var oldValues = params.getAllValues('riderName');

for (var i = 0; i &lt; oldValues.length; i++)
{
if (direction &gt; 0 &amp;&amp; i != selection) //If we are down, add the value already at index first
{
newValues.push(oldValues[i]);
}

if (i == newSelection)
{
newValues.push(oldValues[selection]);
}

if (direction &lt; 0 &amp;&amp; i != selection) //If we are up, add the value already at index after
{
newValues.push(oldValues[i]);
}
}

params.setAllValues('riderName', newValues);
params.setValue('params.table', 0, newSelection);
}</api>
   </meta>
   <table colspan="1" fill="both" height="500" insets="2,2,2,10" left="142" rowspan="1" style="bg#dark;bdr:round;" top="159" weightx="1.0" weighty="1.0" width="1261">
      <tr>
         <label colspan="2" fill="both" height="50" insets="2,2,2,2" name="Competitiors" rowspan="1" style="txt-align:west;font:bold;size:Big;" weightx="1.0"/>
         <param expand="true" fill="both" insets="2,2,2,2" oid="Selection" style="bdr:etched;bg#dark;font:bold;size:Big;o#000000;fg#FFFFFF;txt-align:center;" weightx="0.0" weighty="0.0" widget="spinner"/>
         <button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name=" ▲ " rowspan="1" style="bg#lightdivider;size:16;font:bold;" weightx="0.0" weighty="0.0">
            <task tasktype="ogscript">moveUp();</task>
         </button>
         <button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name=" ▼ " rowspan="1" style="bg#lightdivider;size:16;font:bold;" weightx="0.0" weighty="0.0">
            <task tasktype="ogscript">moveDown();</task>
            <task tasktype="ogscript"/>
         </button>
         <button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name="Add Competitor +" rowspan="1" style="bg#23B126;size:16;font:bold;" weightx="0.15" weighty="0.0">
            <task tasktype="ogscript">var newValue = {
   riderName: "",
   riderNumber: "",
   riderCountry: "",
   riderFinalTime: "",
   riderSplit1: "",
   riderSplit2: "",
   riderSplit3: "",
   riderSplit4: ""
}

var p = params.getParam('params.table', 0);
p.setValueAt(p.getElementCount(), newValue);</task>
         </button>
         <button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name="Delete Competitor -" rowspan="1" style="bg#D41033;size:16;font:bold;" weightx="0.15" weighty="0.0">
            <task tasktype="ogscript">&lt;button buttontype="push" height="60" left="760" name="Delete Selected" top="380" width="120"&gt;
   &lt;task tasktype="ogscript"&gt;var selection = params.getValue('Selection', 0);
if (selection &amp;lt; 0)
{
   return;
}

var newValue = new Array();
var table = params.getParam('params.table', 0);
for (var i = 0; i &amp;lt; table.getElementCount(); i++)
{
   if (i != selection)
   {
      newValue.push(table.getValueAt(i));
   }
}

params.setAllValues('params.table', newValue);&lt;/task&gt;
&lt;/button&gt;</task>
         </button>
      </tr>
      <tr>
         <param colspan="7" expand="true" fill="both" insets="2,2,2,2" oid="params.table" rowspan="1" showlabel="false" weightx="1.0" weighty="1.0">
            <config key="w.reorder">true</config>
            <config key="w.selectionparam">Selection</config>
         </param>
      </tr>
   </table>
</abs>

------------------------------
Sam McIntosh
National Rugby League
Australia
------------------------------

2. RE: Table navigation with add/delete row function

0 Recommend
Thomas Wilson
Posted 13 days ago
Hi Sam,

I've had a quick look at your table, and edited the button [ADD COMPETITOR +]

and this now works.

you need to create an iteration to create an array entry for each param,

you can follow what I've done here and apply it to the other data buttons you need.

hope this helps.

<abs contexttype="opengear" id="_top" keepalive="false">
<meta>
<params>
<param access="1" maxlength="0" name="Rider Name" oid="riderName" precision="0" type="STRING_ARRAY" widget="default">
<value>Name 1</value>
<value>Name 2</value>
<value>Name 3</value>
<value>Name 4</value>
<value>Name 5</value>
</param>
<param access="1" maxlength="0" name="Rider Number" oid="riderNumber" precision="0" type="STRING_ARRAY" widget="default">
<value>1</value>
<value>2</value>
<value>3</value>
<value>4</value>
<value>5</value>
</param>
<param access="1" maxlength="0" name="Country" oid="riderCountry" precision="0" type="STRING_ARRAY" widget="default">
<value>CAN</value>
<value>GBR</value>
<value>AUS</value>
<value>USA</value>
<value>AUS</value>
</param>
<param access="1" maxlength="0" name="Final Time" oid="riderFinalTime" precision="0" type="STRING_ARRAY" widget="default">
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
</param>
<param access="1" maxlength="0" name="Split 1" oid="riderSplit1" precision="0" type="STRING_ARRAY" widget="default">
<value>1</value>
<value>2</value>
<value>3</value>
<value>4</value>
<value>5</value>
</param>
<param access="1" maxlength="0" name="Split 2" oid="riderSplit2" precision="0" type="STRING_ARRAY" widget="default">
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
</param>
<param access="1" maxlength="0" name="Split 3" oid="riderSplit3" precision="0" type="STRING_ARRAY" widget="default">
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
</param>
<param access="1" maxlength="0" name="Split 4" oid="riderSplit4" precision="0" type="STRING_ARRAY" widget="default">
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
<value>
</value>
</param>
<param access="1" constrainttype="STRING_CHOICE" name="params.table" oid="params.table" precision="0" type="INT32" value="4" widget="table">
<config key="w.selectionparam">Selection</config>
<constraint>riderName</constraint>
<constraint>riderNumber</constraint>
<constraint>riderCountry</constraint>
<constraint>riderFinalTime</constraint>
<constraint>riderSplit1</constraint>
<constraint>riderSplit2</constraint>
<constraint>riderSplit3</constraint>
<constraint>riderSplit4</constraint>
</param>
<param access="1" constrainttype="INT_NULL" name="Selection" oid="Selection" precision="0" type="INT32" value="1" widget="label"/>
</params>
<api>function moveUp() { move(-1); }
function moveDown() { move(1); }

function move(direction)
{
var selection = params.getValue('params.table', 0);
var newSelection = selection + direction; if (newSelection < 0 || newSelection > params.getElementCount('riderName'))
return; //If we are moving up but are already at the top or moving down and are already at the bottom } var newValues = []; var oldValues = params.getAllValues('riderName'); for (var i = 0; i < oldValues.length; i++) { if (direction > 0 && i != selection) //If we are down, add the value already at index first { newValues.push(oldValues[i]); } if (i == newSelection) { newValues.push(oldValues[selection]); } if (direction < 0 && i != selection) //If we are up, add the value already at index after { newValues.push(oldValues[i]); } } params.setAllValues('riderName', newValues); params.setValue('params.table', 0, newSelection); }
}</api>
</meta>
<table colspan="1" fill="both" height="750" insets="2,2,2,10" left="142" rowspan="1" style="bg#dark;bdr:round;" top="159" weightx="1.0" weighty="1.0" width="1261">
<tr>
<label colspan="2" fill="both" height="50" insets="2,2,2,2" name="Competitiors" rowspan="1" style="txt-align:west;font:bold;size:Big;" weightx="1.0"/>
<param expand="true" fill="both" insets="2,2,2,2" oid="Selection" style="bdr:etched;bg#dark;font:bold;size:Big;o#000000;fg#FFFFFF;txt-align:center;" weightx="0.0" weighty="0.0" widget="spinner"/>
<button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name=" ▲ " rowspan="1" style="bg#lightdivider;size:16;font:bold;" weightx="0.0" weighty="0.0">
<task tasktype="ogscript">moveUp();</task>
</button>
<button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name=" ▼ " rowspan="1" style="bg#lightdivider;size:16;font:bold;" weightx="0.0" weighty="0.0">
<task tasktype="ogscript">moveDown();</task>
<task tasktype="ogscript"/>
</button>
<button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name="Add Competitor +" rowspan="1" style="bg#23B126;size:16;font:bold;" weightx="0.15" weighty="0.0">
<task tasktype="ogscript">

//figure out how many cols (Params) need to be added
var tableCols = params.getConstraint('params.table')
var tableCols = tableCols.getChoices()

// figure out how many array records are currently entered
var tableRowCount = params.getElementCount('riderName');

//append a new array entry at the end of the list

for (var i = 0; i < tableCols.length; i++)
{

var p = params.getParam(tableCols[i], 0)
p.setValueAt(tableRowCount, "")

}
</task>
</button>
<button buttontype="push" colspan="1" fill="both" insets="2,2,2,2" name="Delete Competitor -" rowspan="1" style="bg#D41033;size:16;font:bold;" weightx="0.15" weighty="0.0">
<task tasktype="ogscript"><button buttontype="push" height="60" left="760" name="Delete Selected" top="380" width="120"> <task tasktype="ogscript">var selection = params.getValue('Selection', 0); if (selection &lt; 0) { return; } var newValue = new Array(); var table = params.getParam('params.table', 0); for (var i = 0; i &lt; table.getElementCount(); i++) { if (i != selection) { newValue.push(table.getValueAt(i)); } } params.setAllValues('params.table', newValue);</task> </button></task>
</button>
</tr>
<tr>
<param colspan="7" expand="true" fill="both" insets="2,2,2,2" oid="params.table" rowspan="1" showlabel="false" weightx="1.0" weighty="1.0">
<config key="w.reorder">true</config>
<config key="w.selectionparam">Selection</config>
</param>
</tr>
</table>
<button buttontype="push" height="1" left="641" top="58" width="1"/>
</abs>

------------------------------
Thomas Wilson
Project Manager / Engineer
Innovative Production Services
4K ONE OB Truck | SYDNEY
------------------------------

Original Message

Facility Control

Table navigation with add/delete row function

Sam McIntosh15 days ago

Thomas Wilson13 days ago

1. Table navigation with add/delete row function

2. RE: Table navigation with add/delete row function

CONTACT US

COMMUNITY

TERMS & PRIVACY