| ';
out += this._renderHiddenField(defaultsArr);
out += '';
origFld.outerHTML = out;
this._fldAvailable = document.getElementById(elementId + '_fldAvailable');
this._fldSelected = document.getElementById(elementId + '_fldSelected');
s.init(this._fldAvailable);
s.init(this._fldSelected);
if (!this.moveOnClick) {
this.buttonSelect.drawInto(elementId + '_btnSel');
eval(this._objectId + '_btnSel' + ' = Bs_Objects['+this._id+'].buttonSelect;');
this.buttonDeselect.drawInto(elementId + '_btnDe');
eval(this._objectId + '_btnDe' + ' = Bs_Objects['+this._id+'].buttonDeselect;');
}
if (typeof(this.maxSelectedNumber) == 'undefined') {
try {
this.buttonSelectAll.drawInto(elementId + '_btnSelAll');
eval(this._objectId + '_btnSelAll' + ' = Bs_Objects['+this._id+'].buttonSelectAll;');
this.buttonDeselectAll.drawInto(elementId + '_btnDeAll');
eval(this._objectId + '_btnDeAll' + ' = Bs_Objects['+this._id+'].buttonDeselectAll;');
} catch (e) {
//never mind, buttons may be unset, so they are not used.
}
}
}
/**
* returns an array with the keys of the selected elements as vector.
* @access public
* @return array (vector)
*/
this.getValue = function() {
return this._fldSelected.getAllKeys();
}
/**
*
* @access public
* @param array options (hash)
* @return ?
* @since bs4.5
*/
this.setOptions = function(options) {
var selected = this._fldSelected.getAllKeys();
this._fldAvailable.prune();
this._fldSelected.prune();
for (var i=0; i= 0) {
//var newOpt = new Option(options.text, .value, false, false);
//this._fldSelected.options[this._fldSelected.length] = newOpt;
}
*/
}
for (var key in options) {
var newOpt = new Option(options[key], key, false, false);
this._fldAvailable.options[this._fldAvailable.length] = newOpt;
}
}
/**
* moves the selected items of the 'available' field to the 'selected' field.
* @access public
* @return void
*/
this.selectSelected = function() {
this._fldAvailable.moveSelectedTo(this._fldSelected);
this._updateHiddenField();
}
/**
* moves all items of the 'available' field to the 'selected' field.
* @access public
* @return void
*/
this.selectAll = function() {
this._fldAvailable.moveAllTo(this._fldSelected);
this._updateHiddenField();
}
/**
* moves the selected items of the 'selected' field to the 'available' field.
* @access public
* @return void
*/
this.deselectSelected = function() {
this._fldSelected.moveSelectedTo(this._fldAvailable);
this._updateHiddenField();
}
/**
* moves all items of the 'selected' field to the 'available' field.
* @access public
* @return void
*/
this.deselectAll = function() {
this._fldSelected.moveAllTo(this._fldAvailable);
this._updateHiddenField();
}
/**
* moves the option specified from the 'available' field to the 'selected' field.
* @access public
* @param string optionValue (the .value attribute of the option you want to move)
* @return bool
*/
this.moveAvailableOptionToSelected = function(optionValue) {
if (this.maxSelectionReached()) {
this.alertMaxSelectionWarning();
} else {
var status = this._fldAvailable.moveTo(this._fldSelected, optionValue);
this._updateHiddenField();
return status;
}
}
/**
* moves the option specified from the 'selected' field to the 'available' field.
* @access public
* @param string optionValue (the .value attribute of the option you want to move)
* @return bool
*/
this.moveSelectedOptionToAvailable = function(optionValue) {
var status = this._fldSelected.moveTo(this._fldAvailable, optionValue);
this._updateHiddenField();
return status;
}
/**
* Adds elements to the flipflop fields (at runtime).
* @access public
* @param array dataHash
* @param bool selected (default is false which adds to the 'available' field.)
* @param bool posStart (default is false which adds at bottom)
* @return void
*/
this.addElementsByHash = function(dataHash, selected, posStart) {
if (selected) {
this._fldSelected.addElementsByHash(dataHash, posStart);
} else {
this._fldAvailable.addElementsByHash(dataHash, posStart);
}
}
/**
* fires on a single click on the 'available' select field.
* @access public (you don't need that)
* @return void
*/
this.onClickAvailable = function() {
if (this.disabled) return;
this._onClickAvailableOption();
}
/**
* fires on a single click on the 'selected' select field.
* @access public (you don't need that)
* @return void
*/
this.onClickSelected = function() {
if (this.disabled) return;
this._onClickSelectedOption();
}
/**
* fires on a double click on the 'available' select field.
* @access public (you don't need that)
* @return void
*/
this.onDblClickAvailable = function() {
if (this.disabled) return;
if (this.moveOnDblClick) this.moveAvailableOptionToSelected(event.srcElement.value);
}
/**
* fires on a double click on the 'selected' select field.
* @access public (you don't need that)
* @return void
*/
this.onDblClickSelected = function() {
if (this.disabled) return;
if (this.moveOnDblClick) this.moveSelectedOptionToAvailable(event.srcElement.value);
}
/**
* fires on a single click on an option in the 'available' select field.
* @access private
* @return void
*/
this._onClickAvailableOption = function(b) {
//problem here: the click happened, the method fired, but selectedIndex is not updated yet.
//timing problem. if we wait a bit (0.1 secs or so) it's ready. thus we use the setTimeout to try again.
if (b == true) {
try {
var srcElm = (!bs_isNull(event) && !bs_isNull(event.srcElement)) ? event.srcElement : this._lastOnClickOptionElm;
var opt = srcElm.options[srcElm.selectedIndex];
if (this.showCaptionLine) {
document.getElementById(this._objectId + '_captionLine').innerHTML = opt.text; //opt.value
}
} catch (e) {
//does not work in moz.
}
if (this.moveOnClick) {
this.moveAvailableOptionToSelected(srcElm.value);
}
} else {
this._lastOnClickOptionElm = event.srcElement;
setTimeout('Bs_Objects['+this._id+']._onClickAvailableOption(true)', 50);
return;
}
}
/**
* fires on a single click on an option in the 'selected' select field.
* @access private
* @return void
*/
this._onClickSelectedOption = function(b) {
//problem here: the click happened, the method fired, but selectedIndex is not updated yet.
//timing problem. if we wait a bit (0.1 secs or so) it's ready. thus we use the setTimetout to try again.
if (b == true) {
try {
var srcElm = (!bs_isNull(event) && !bs_isNull(event.srcElement)) ? event.srcElement : this._lastOnClickOptionElm;
var opt = srcElm.options[srcElm.selectedIndex];
if (this.showCaptionLine) {
document.getElementById(this._objectId + '_captionLine').innerHTML = opt.text; //opt.value
}
} catch (e) {
//does not work in moz.
}
if (this.moveOnClick) {
this.moveSelectedOptionToAvailable(srcElm.value);
}
} else {
this._lastOnClickOptionElm = event.srcElement;
setTimeout('Bs_Objects['+this._id+']._onClickSelectedOption(true)', 50);
return;
}
}
/**
* how to render the fields. default is left-to-right.
* if true then top-to-bottom will be done.
*
* @access public
* @var bool upDown
* @return void
* @see var this._renderTopToBottom
*/
this.setRenderOrientation = function(upDown) {
this._renderTopToBottom = upDown;
this.buttonSelect.imgName = (this._renderTopToBottom) ? 'bs_down.gif' : 'bs_forward.gif';
this.buttonSelectAll.imgName = (this._renderTopToBottom) ? 'bs_dodown.gif' : 'bs_foforward.gif';
this.buttonDeselect.imgName = (this._renderTopToBottom) ? 'bs_up.gif' : 'bs_back.gif';
this.buttonDeselectAll.imgName = (this._renderTopToBottom) ? 'bs_upup.gif' : 'bs_baback.gif';
}
/**
* tells if the this.maxSelectedNumber is reached already.
* @access public
* @return bool
* @see vars this.maxSelectedNumber, this.maxSelectedWarning
*/
this.maxSelectionReached = function() {
return (this.howManySelected() >= this.maxSelectedNumber);
}
/**
* alerts the "max selection reached" warning. no more options can be selected, unless
* others are dropped.
* @access public (if you like)
* @return void
*/
this.alertMaxSelectionWarning = function() {
alert(this.maxSelectedWarning.replace('__maxSelectedNumber__', this.maxSelectedNumber));
}
/*
this.checkMaxSelectionAfter = function() {
}*/
/**
* tells how many options are currently selected.
* @access public
* @return int (0-n)
*/
this.howManySelected = function() {
return this._fldSelected.options.length;
}
/**
* disables/enables the field.
* @access public
* @param bool disabled
* @see getDisabled(), var _disabled
* @since bs4.5
*/
this.setDisabled = function(disabled) {
this._disabled = disabled;
if (this._disabled) {
var btnValue = 0;
} else {
var btnValue = 1;
}
//disable the buttons:
if (!bs_isNull(this.buttonSelect)) this.buttonSelect.setStatus(btnValue);
if (!bs_isNull(this.buttonSelectAll)) this.buttonSelectAll.setStatus(btnValue);
if (!bs_isNull(this.buttonDeselect)) this.buttonDeselect.setStatus(btnValue);
if (!bs_isNull(this.buttonDeselectAll)) this.buttonDeselectAll.setStatus(btnValue);
//disable the select fields:
if (!bs_isNull(this._fldAvailable)) this._fldAvailable.disabled = this._disabled;
if (!bs_isNull(this._fldSelected)) this._fldSelected.disabled = this._disabled;
}
/**
* disables/enables the field.
* @access public
* @return bool
* @see setDisabled(), var _disabled
* @since bs4.5
*/
this.getDisabled = function() {
return this._disabled;
}
/**
* @access private
* @param array defaultsArr
* @return string
*/
this._renderHiddenField = function(defaultsArr) {
var ret = new Array;
for (var i=0; i';
}
return ret.join('');
}
/**
* updates the value of the hidden field.
* @access private
* @return void
*/
this._updateHiddenField = function() {
var defaultsArr = this._fldSelected.getAllKeys();
var str = this._renderHiddenField(defaultsArr);
document.getElementById(this._objectId + '_hiddenFldSpan').innerHTML = str;
}
/**
* attaches an event.
*
* the following triggers can be used:
* 'onBeforeChange'
* 'onAfterChange'
*
* the onXXXChange events fire when the wheel is used, a button (up/down)
* is clicked, cursor up or down is pushed. but they do NOT fire when you
* use the api methods setValue(), increase() and decrease(). because
* then you already know what's happening.
*
*
* the events will be executed in the order they were registered.
*
* if an onBeforeXXX event you've attached returns bool FALSE, it
* will stop executing any other attached events in that queue,
* and it will quit. example: if you attach an onBeforeChange
* event, and your code returns FALSE, the change won't be done
* at all.
*
* examples:
* myObj.attachEvent('onBeforeChange', myFunction);
* then your function myFunction() receives one param, it is
* a reference to this object (myObj).
*
* myObj.attachEvent('onBeforeChange', "if (true) return false;");
* this is an example with code attached that will be evaluated.
*
* @access public
* @param string trigger
* @param mixed yourEvent (string (of code) or function)
* @return void
* @see var this._attachedEvents
*/
this.attachEvent = function(trigger, yourEvent) {
if (typeof(this._attachedEvents) == 'undefined') {
this._attachedEvents = new Array();
}
if (typeof(this._attachedEvents[trigger]) == 'undefined') {
this._attachedEvents[trigger] = new Array(yourEvent);
} else {
this._attachedEvents[trigger][this._attachedEvents[trigger].length] = yourEvent;
}
}
/**
* tells if any event is attached for the trigger specified.
* @access public
* @param string trigger
* @return bool
*/
this.hasEventAttached = function(trigger) {
return (this._attachedEvents && this._attachedEvents[trigger]);
}
/**
* fires the events for the trigger specified.
* @access public (used internally but feel free to trigger events yourself...)
* @param string trigger
* @return void
*/
this.fireEvent = function(trigger) {
if (this._attachedEvents && this._attachedEvents[trigger]) {
var e = this._attachedEvents[trigger];
if ((typeof(e) == 'string') || (typeof(e) == 'function')) {
e = new Array(e);
}
for (var i=0; i |