luos/workflow/engine/xmlform/dynaforms/fields/dropdown.xml

<?xml version="1.0" encoding="UTF-8"?>
<dynaForm name="dropdown" type="xmlform" width="100%" enableTemplate="1">
  <PME_A type="hidden"/>
  <PME_TYPE type="hidden"/>
  <PME_PRO_UID type="hidden"/>
  <PME_TITLE type="title" enableHTML="1">
    <en><![CDATA[Properties]]></en>
  </PME_TITLE>
  <PME_XMLNODE_NAME type="text" size="32" maxlength="64" validate="NodeName" dependentFields="PME_VALIDATE_NAME" required="1">
    <en><![CDATA[Field Name]]></en>
  </PME_XMLNODE_NAME>
  <PME_XMLNODE_NAME_OLD type="hidden"/>
  <PME_VALIDATE_NAME type="hidden" sqlConnection="XMLDB" required="1">
SELECT XMLNODE_NAME, TYPE FROM dynaForm WHERE XMLNODE_NAME = @@PME_XMLNODE_NAME
</PME_VALIDATE_NAME>
  <PME_LABEL type="text" maxlength="255" size="50">
    <en><![CDATA[Label]]></en>
  </PME_LABEL>
  <PME_SUBTITLE3 type="title" enableHTML="1">
    <en><![CDATA[Behaviour]]></en>
  </PME_SUBTITLE3>
  <PME_REQUIRED type="checkbox" falseValue="0" value="1" defaultvalue="0" labelOnRight="0">
    <en><![CDATA[Required]]></en>
  </PME_REQUIRED>
  <PME_READONLY type="checkbox" falseValue="0" value="1" defaultvalue="0" labelOnRight="0">
    <en><![CDATA[Read Only]]></en>
  </PME_READONLY>
  <PME_OPTGROUP type="checkbox" value="1" falseValue="0" defaultvalue="0" labelOnRight="0">
    <en><![CDATA[Include Option Group]]></en>
  </PME_OPTGROUP>
  <PME_DEPENDENTFIELDS type="listbox" defaultvalue="" sqlconnection="XMLDB" width="362"><![CDATA[
select XMLNODE_NAME, XMLNODE_NAME AS NAME FROM dynaForm WHERE XMLNODE_NAME <> @@PME_XMLNODE_NAME AND XMLNODE_NAME <> ""	AND ( TYPE="text" or TYPE="textarea" or TYPE="dropdown" or TYPE="listbox" or TYPE="hidden" )
  ]]><en><![CDATA[Dependent Fields]]><option name=""><![CDATA[(none)]]></option></en></PME_DEPENDENTFIELDS>
  <PME_DEFAULTVALUE type="text" maxlength="50" size="49" defaultvalue="">
    <en><![CDATA[Default Value]]></en>
  </PME_DEFAULTVALUE>
  <!--<PME_SAVELABEL type="checkbox" falseValue="0" value="1" defaultvalue="0" labelOnRight="0">
  <en>Save label of selected value in variable</en>
</PME_SAVELABEL>-->
  <PME_HINT type="textarea" cols="47" rows="3">
    <en><![CDATA[Hint]]></en>
  </PME_HINT>
  <PME_SUBTITLE type="title" enableHTML="1">
    <en><![CDATA[Appearance]]></en>
  </PME_SUBTITLE>
  <PME_MODE type="dropdown" defaultvalue="edit">
    <en><![CDATA[Mode]]><option name="edit"><![CDATA[Edit]]></option><option name="view"><![CDATA[View]]></option></en>
  </PME_MODE>
  <PME_SUBTITLE2 type="title" enableHTML="1">
    <en><![CDATA[Data]]></en>
  </PME_SUBTITLE2>
  <PME_SQLCONNECTION type="dropdown" sqlconnection="dbarray"><![CDATA[
  SELECT * FROM DB_CONNECTIONS
  ]]><en><![CDATA[Sql Connection]]><option name=""><![CDATA[(none)]]></option></en></PME_SQLCONNECTION>
  <PME_XMLNODE_VALUE type="textarea" cols="47" rows="3">
    <en><![CDATA[Sql]]></en>
  </PME_XMLNODE_VALUE>
  <PME_SUBTITLE4 type="subtitle">
    <en><![CDATA[Options]]></en>
  </PME_SUBTITLE4>
  <PME_OPTIONS type="grid" xmlgrid="dynaforms/fields/_optionsOptGroup" editRow="" deleteRow="1" insertRow="1" sqlconnection="XMLDB"/>
  <BTN_CANCEL type="button" onclick="cancel();">
    <en><![CDATA[Cancel]]></en>
  </BTN_CANCEL>
  <PME_ACCEPT type="button" onclick="fieldsSave( this.form );">
    <en><![CDATA[Save]]></en>
  </PME_ACCEPT>
  <PME_G_FORM_ID type="phpvariable"/>
  <PME_JS type="javascript"><![CDATA[
var lblOptGroup = "";

function gridOptionOptGroupColumn(show, swDelete)
{
    var tableGrid = document.getElementById("PME_OPTIONS");
    var i = 0;
    var j = document.getElementById("form[PME_OPTIONS][1][OPTGROUP]").parentNode.cellIndex;

    var swReadOnly = false;
    var count = 0;

    for (i = 0; i <= tableGrid.rows.length - 1 - 1; i++) {
        //tableGrid.rows[i].cells[j].style.display = (show == 1)? "inline" : "none";
        //tableGrid.rows[i].cells[j].style.visibility = (show == 1)? "visible" : "hidden";

        if (i > 0) {
            tableGrid.rows[i].cells[j].getElementsByTagName("input")[0].style.visibility = (show == 1)? "visible" : "hidden";
            swReadOnly = false;

            if (show == 1) {
                if (tableGrid.rows[i].cells[j].getElementsByTagName("input")[0].checked) {
                    count = count + 1;

                    tableGrid.rows[i].cells[j - 2].getElementsByTagName("input")[0].value = "optgroup" + count;
                    swReadOnly = true;
                }
            } else {
                if (tableGrid.rows[i].cells[j].getElementsByTagName("input")[0].checked && swDelete == 0) {
                    tableGrid.rows[i].cells[j - 2].getElementsByTagName("input")[0].value = "";
                }
            }

            tableGrid.rows[i].cells[j - 2].getElementsByTagName("input")[0].readOnly = swReadOnly;
        } else {
            if (lblOptGroup == "") {
                lblOptGroup = tableGrid.rows[i].cells[j].innerHTML;
            }

            tableGrid.rows[i].cells[j].style.width = "25%";
            tableGrid.rows[i].cells[j].innerHTML = (show == 1)? lblOptGroup : "";
        }
    }
}

function gridOptionOptGroupCheck(index)
{
    var tableGrid = document.getElementById("PME_OPTIONS");
    var i = 0;
    var j = document.getElementById("form[PME_OPTIONS][1][OPTGROUP]").parentNode.cellIndex;

    var count = 0;

    document.getElementById("form[PME_OPTIONS][" + index + "][NAME]").value = "";
    document.getElementById("form[PME_OPTIONS][" + index + "][NAME]").readOnly = (document.getElementById("form[PME_OPTIONS][" + index + "][OPTGROUP]").checked)? true : false;

    for (i = 1; i <= tableGrid.rows.length - 1 - 1; i++) {
        if (tableGrid.rows[i].cells[j].getElementsByTagName("input")[0].checked) {
            count = count + 1;

            tableGrid.rows[i].cells[j - 2].getElementsByTagName("input")[0].value = "optgroup" + count;
        }
    }
}

function hideElement( element ) {
  var tr = myTR( element );
  tr.style.display='none';
}
function showElement( element ) {
  var tr = myTR( element );
  tr.style.display='';
}
function hideTRs( tr , count ) {
  var table = tr.parentNode;
  for(var r=1 ; r <= count ; r++ ) {
    table.rows[ tr.index + r ].style.display = 'none';
  }
}
function showTRs( tr , count ) {
  var table = tr.parentNode;
  for(var r=1 ; r <= count ; r++ ) {
    table.rows[ tr.index + r ].style.display = '';
  }
}
function myTR( element ){
  while ( element.getAttribute('tagName') !== 'TR' ) {
    element = element.parentNode;
  }
  return element;
}
var fieldForm="dropdown";
var fieldName=getField("PME_XMLNODE_NAME",fieldForm);
var savedFieldName=fieldName.value;
var pme_validating;
fieldName.focus();
fieldName.select();
leimnud.event.add(fieldName, 'change', {method:dynaformVerifyFieldName, instance:fieldName, event:true});

function cancel(){
    currentPopupWindow.remove();
}





getField("PME_OPTGROUP").onclick = function () { gridOptionOptGroupColumn((getField("PME_OPTGROUP").checked)? 1 : 0, 0); };

for (var i = 1; i <= document.getElementById("PME_OPTIONS").rows.length - 1 - 1; i++) {
    eval("getField(\"PME_OPTIONS][" + i + "][OPTGROUP\").onclick = function () { gridOptionOptGroupCheck(" + i + "); };");
}

grid_PME_OPTIONS.onaddrow = function (index) {
    getField("PME_OPTIONS][" + index + "][NAME").readOnly = false;
    getField("PME_OPTIONS][" + index + "][OPTGROUP").onclick = function () { gridOptionOptGroupCheck(index); };
}

grid_PME_OPTIONS.ondeleterow = function (index) {
    gridOptionOptGroupColumn((getField("PME_OPTGROUP").checked)? 1 : 0, 1);
}

gridOptionOptGroupColumn((getField("PME_OPTGROUP").checked)? 1 : 0, 0);
]]></PME_JS>
</dynaForm>