From 6876303615a239dc409dee481a877a8f934f340d Mon Sep 17 00:00:00 2001 From: prxmt Date: Tue, 6 May 2014 13:05:29 -0700 Subject: [PATCH 1/6] Adding support for multi select dropdown Used in ASP.NET MVC To use, set the type on the field to 'multiselectddl'. The options dropdown will become a select. Data is treated as comma delimited. Based off of info from: https://github.com/hikalkan/jtable/issues/52 --- lib/jquery.jtable.js | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index 869af246..b71c593b 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -1556,6 +1556,8 @@ THE SOFTWARE. return this._createPasswordInputForField(field, fieldName, value); } else if (field.type == 'checkbox') { return this._createCheckboxForField(field, fieldName, value); + } else if (field.type == 'multiselectddl') { + return this._createDropDownListMultiForField(field, fieldName, value); } else if (field.options) { if (field.type == 'radiobutton') { return this._createRadioButtonListForField(field, fieldName, value, record, formType); @@ -1691,6 +1693,26 @@ THE SOFTWARE. return $containerDiv; }, + _createDropDownListMultiForField: function (field, fieldName, value) { + //Create a container div + var $containerDiv = $('
'); + + //Create multi-select element + var $select = $('').appendTo($containerDiv); + + var values = value.split(','); + //add options + var options = this._getOptionsForField(fieldName); + $.each(options, function(index, element) { + $select.append(''); + }); + $.each(values, function (index, element) { + $select.children('option[value="' + element + '"]').attr("selected", "selected"); + }); + + return $containerDiv; + }, + /* Creates a drop down list (combobox) input element for a field. *************************************************************************/ _createDropDownListForField: function (field, fieldName, value, record, source, form) { From e00c9565561eb6ee256a34afcb062b16dbf49b70 Mon Sep 17 00:00:00 2001 From: prxmt Date: Tue, 6 May 2014 13:17:28 -0700 Subject: [PATCH 2/6] Fix multidropdown when value is array After editing and saving a multi select, if re-editing the value goes from comma delimited string to an array, which gets passed to _createDropDownListMultiForField. Check if is array and set, otherwise call .split() --- lib/jquery.jtable.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index b71c593b..9308bbf2 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -1700,7 +1700,12 @@ THE SOFTWARE. //Create multi-select element var $select = $('').appendTo($containerDiv); - var values = value.split(','); + if (Object.prototype.toString.call(value) === '[object Array]') { + values = value; + } else { //string + var values = value.split(','); + } + //add options var options = this._getOptionsForField(fieldName); $.each(options, function(index, element) { From 607d9118cb3fd9bd5a471eccd753dac0ea5284c7 Mon Sep 17 00:00:00 2001 From: prxmt Date: Tue, 6 May 2014 13:40:06 -0700 Subject: [PATCH 3/6] Get it working --- lib/jquery.jtable.js | 32 +++++++++++++++++++------------- 1 file changed, 19 insertions(+), 13 deletions(-) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index 9308bbf2..be5cb125 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -1700,21 +1700,27 @@ THE SOFTWARE. //Create multi-select element var $select = $('').appendTo($containerDiv); - if (Object.prototype.toString.call(value) === '[object Array]') { - values = value; - } else { //string - var values = value.split(','); - } - - //add options var options = this._getOptionsForField(fieldName); - $.each(options, function(index, element) { - $select.append(''); - }); - $.each(values, function (index, element) { - $select.children('option[value="' + element + '"]').attr("selected", "selected"); - }); + if (value) { + if (typeof value === 'string') { + var values = value.split(','); + } else { //(Object.prototype.toString.call(value) === '[object Array]') { + values = value; + } + //add options + $.each(options, function(index, element) { + //$select.append(''); + $select.append(''); + }); + $.each(values, function(index, element) { + $select.children('option[value="' + element + '"]').attr("selected", "selected"); + }); + } else { + $.each(options, function (index, element) { + $select.append(''); + }); + } return $containerDiv; }, From 56df156947beb1a6972ee903498ca5ed7f2c27ad Mon Sep 17 00:00:00 2001 From: prxmt Date: Thu, 8 May 2014 11:38:30 -0700 Subject: [PATCH 4/6] updates --- lib/jquery.jtable.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index be5cb125..e8d2fcd5 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -1,4 +1,4 @@ -/* +/* jTable 2.4.0 http://www.jtable.org @@ -1721,6 +1721,7 @@ THE SOFTWARE. $select.append(''); }); } + return $containerDiv; }, @@ -2664,6 +2665,8 @@ THE SOFTWARE. self._$editingRow = $tableRow; self._$editDiv.append($editForm).dialog('open'); self._trigger("formCreated", null, { form: $editForm, formType: 'edit', record: record, row: $tableRow }); + + //$('input').first().focus().blur(); }, /* Saves editing form to the server and updates the record on the table. From 6c7ee74a0f1d65a9d261086ed5b81a4029d0f710 Mon Sep 17 00:00:00 2001 From: prxmt Date: Thu, 15 May 2014 10:49:13 -0700 Subject: [PATCH 5/6] Exposing table 'options' data to 'options' function event handler Have a need to expose some internal data from the jtable 'options' data object to the 'options' function (i.e. ajax URL to populate 'options' dropdown) --- lib/jquery.jtable.js | 1 + 1 file changed, 1 insertion(+) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index e8d2fcd5..cb7c4349 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -746,6 +746,7 @@ THE SOFTWARE. record: record, value: fieldValue, source: 'list', + tableoptions: this.options, dependedValues: this._createDependedValuesUsingRecord(record, field.dependsOn) }); return this._findOptionByValue(options, fieldValue).DisplayText; From 1c72e62a78bd553950ced4d2d39d9c20515c4743 Mon Sep 17 00:00:00 2001 From: prxmt Date: Thu, 15 May 2014 10:55:27 -0700 Subject: [PATCH 6/6] Exposing table 'options' data to 'options' function event handler - fix --- lib/jquery.jtable.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/jquery.jtable.js b/lib/jquery.jtable.js index cb7c4349..8a9bf2b1 100644 --- a/lib/jquery.jtable.js +++ b/lib/jquery.jtable.js @@ -746,7 +746,6 @@ THE SOFTWARE. record: record, value: fieldValue, source: 'list', - tableoptions: this.options, dependedValues: this._createDependedValuesUsingRecord(record, field.dependsOn) }); return this._findOptionByValue(options, fieldValue).DisplayText; @@ -805,6 +804,7 @@ THE SOFTWARE. funcParams = $.extend(true, { _cacheCleared: false, dependedValues: {}, + tableoptions: this.options, clearCache: function () { this._cacheCleared = true; }