src/main/webapp/assets/js/custom.js
/**
 * Make more useful form objects out of multiple-selects
 *
 * @author OpenWeb Solutions, LLC
 */
Make more useful form objects out of multiple-selects
@author OpenWeb Solutions, LLC
Make more useful form objects out of multiple - selects @author OpenWeb Solutions LLC
function OWSMultSelect(elem) {
    if (!(elem instanceof HTMLSelectElement) || !elem.multiple)
        return;
    var myObj = this;
    this.name = elem.name;
    this.fromElement = elem;
    this.fromElement.name = "";
    this.fromElement.ondblclick = function(evt) {
        myObj.promoteSelected();
    };
    var w = document.createElement("div");
    w.setAttribute("class", "msel-wrapper");
    w.setAttribute("title", "Move items from list on the left to the right to choose.");
    w.style.display = "inline-block";
    this.fromElement.parentNode.insertBefore(w, this.fromElement);
    var c = document.createElement("div");
    c.setAttribute("class", "msel-from-wrapper");
    c.style.display = "table-cell";
    w.appendChild(c);
    this.fromSearch = document.createElement("input");
    this.fromSearch.setAttribute("class", "msel-search");
    this.fromSearch.style.display = "block";
    this.fromSearch.onkeyup = function(evt) {
        myObj.performFromSearch();
    };
    c.appendChild(this.fromSearch);
    c.appendChild(this.fromElement);
    c = document.createElement("div");
    c.setAttribute("class", "msel-button-wrapper");
    c.style.display = "table-cell";
    c.style.verticalAlign = "middle";
    w.appendChild(c);
    var b = document.createElement("button");
    b.setAttribute("type", "button");
    b.setAttribute("class", "msel-button-promote");
    b.style.display = "block";
    b.appendChild(document.createTextNode(">>"));
    b.onclick = function(evt) {
        myObj.promoteSelected();
    };
    c.appendChild(b);
    b = document.createElement("button");
    b.setAttribute("type", "button");
    b.setAttribute("class", "msel-button-demote");
    b.style.display = "block";
    b.appendChild(document.createTextNode("<<"));
    b.onclick = function(evt) {
        myObj.demoteSelected();
    };
    c.appendChild(b);
    c = document.createElement("div");
    c.setAttribute("class", "msel-to-wrapper");
    c.style.display = "table-cell";
    w.appendChild(c);
    this.toSearch = document.createElement("input");
    this.toSearch.setAttribute("class", "msel-search");
    this.toSearch.style.display = "block";
    this.toSearch.onkeyup = function(evt) {
        myObj.performToSearch();
    };
    c.appendChild(this.toSearch);
    this.toElement = document.createElement("select");
    this.toElement.setAttribute("class", "msel-selected");
    this.toElement.style.display = "block";
    this.toElement.style.height = "100%";
    this.toElement.style.width = this.fromElement.innerWidth + "px";
    this.toElement.setAttribute("size", this.fromElement.getAttribute("size"));
    this.toElement.ondblclick = function(evt) {
        myObj.demoteSelected();
    };
    c.appendChild(this.toElement);
    this.payload = document.createElement("div");
    this.payload.setAttribute("class", "msel-payload");
    c.appendChild(this.payload);
    this.payloadMap = {};
    this.fromMap = {};
    this.promoteSelected();
}
function OWSMultSelect ( elem ) { if ( ! ( elem instanceof HTMLSelectElement ) || ! elem . multiple ) return ; var myObj = this ; this . name = elem . name ; this . fromElement = elem ; this . fromElement . name = "" ; this . fromElement . ondblclick = function ( evt ) { myObj . promoteSelected ( ) ; } ; var w = document . createElement ( "div" ) ; w . setAttribute ( "class" , "msel-wrapper" ) ; w . setAttribute ( "title" , "Move items from list on the left to the right to choose." ) ; w . style . display = "inline-block" ; this . fromElement . parentNode . insertBefore ( w , this . fromElement ) ; var c = document . createElement ( "div" ) ; c . setAttribute ( "class" , "msel-from-wrapper" ) ; c . style . display = "table-cell" ; w . appendChild ( c ) ; this . fromSearch = document . createElement ( "input" ) ; this . fromSearch . setAttribute ( "class" , "msel-search" ) ; this . fromSearch . style . display = "block" ; this . fromSearch . onkeyup = function ( evt ) { myObj . performFromSearch ( ) ; } ; c . appendChild ( this . fromSearch ) ; c . appendChild ( this . fromElement ) ; c = document . createElement ( "div" ) ; c . setAttribute ( "class" , "msel-button-wrapper" ) ; c . style . display = "table-cell" ; c . style . verticalAlign = "middle" ; w . appendChild ( c ) ; var b = document . createElement ( "button" ) ; b . setAttribute ( "type" , "button" ) ; b . setAttribute ( "class" , "msel-button-promote" ) ; b . style . display = "block" ; b . appendChild ( document . createTextNode ( ">>" ) ) ; b . onclick = function ( evt ) { myObj . promoteSelected ( ) ; } ; c . appendChild ( b ) ; b = document . createElement ( "button" ) ; b . setAttribute ( "type" , "button" ) ; b . setAttribute ( "class" , "msel-button-demote" ) ; b . style . display = "block" ; b . appendChild ( document . createTextNode ( "<<" ) ) ; b . onclick = function ( evt ) { myObj . demoteSelected ( ) ; } ; c . appendChild ( b ) ; c = document . createElement ( "div" ) ; c . setAttribute ( "class" , "msel-to-wrapper" ) ; c . style . display = "table-cell" ; w . appendChild ( c ) ; this . toSearch = document . createElement ( "input" ) ; this . toSearch . setAttribute ( "class" , "msel-search" ) ; this . toSearch . style . display = "block" ; this . toSearch . onkeyup = function ( evt ) { myObj . performToSearch ( ) ; } ; c . appendChild ( this . toSearch ) ; this . toElement = document . createElement ( "select" ) ; this . toElement . setAttribute ( "class" , "msel-selected" ) ; this . toElement . style . display = "block" ; this . toElement . style . height = "100%" ; this . toElement . style . width = this . fromElement . innerWidth + "px" ; this . toElement . setAttribute ( "size" , this . fromElement . getAttribute ( "size" ) ) ; this . toElement . ondblclick = function ( evt ) { myObj . demoteSelected ( ) ; } ; c . appendChild ( this . toElement ) ; this . payload = document . createElement ( "div" ) ; this . payload . setAttribute ( "class" , "msel-payload" ) ; c . appendChild ( this . payload ) ; this . payloadMap = { } ; this . fromMap = { } ; this . promoteSelected ( ) ; }
Make more useful form objects out of multiple-selects
 @author OpenWeb Solutions, LLC
Make more useful form objects out of multiple - selects @author OpenWeb Solutions LLC
// First cell // Button cell // Results cell // Hidden Elements // Load any existing ones