Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Multi Select Dropdown with Dependent Values (cascaded dropdown) #1658

Open
wants to merge 6 commits into
base: master
Choose a base branch
from

Conversation

ghost
Copy link

@ghost ghost commented Feb 22, 2015

@stanleyta created an awesome multidropdown option in jTable but it did not work with dependsOn field option. I changed the code to work with the jTable cascaded dropdowns (the dependsOn field option) with a multidropdown.

  1. You will notice in _createInputForRecordField, I moved the type='multiselectddl' under the "elseif (field.options)" section and I gave the _createDropDownListMultiForField more arguments.
  2. For the createDropDownListMultiForField, I simply copy/pasted the code from the jTable _createDropDownListForField function and I added the multiple="multiple" line like @stanleyta had.
    _createInputForRecordField: function (funcParams) {
        ...

        //Create input according to field type
        if (field.type == 'date') {
            return this._createDateInputForField(field, fieldName, value);
        } else if (field.type == 'textarea') {
            return this._createTextAreaForField(field, fieldName, value);
        } else if (field.type == 'password') {
            return this._createPasswordInputForField(field, fieldName, value);
        } else if (field.type == 'checkbox') {
            return this._createCheckboxForField(field, fieldName, value);
        } else if (field.options) {
            if (field.type == 'multiselectddl') {
                return this._createDropDownListMultiForField(field, fieldName, value, record, formType, form);
            } else if (field.type == 'radiobutton') {
                return this._createRadioButtonListForField(field, fieldName, value, record, formType);
            } else {
                return this._createDropDownListForField(field, fieldName, value, record, formType, form);
            }
        } else {
            return this._createTextInputForField(field, fieldName, value);
        }
    },
    _createDropDownListMultiForField: function (field, fieldName, value, record, source, form) {
        //Create a container div
        var $containerDiv = $('<div class="jtable-input jtable-multi-dropdown-input"></div>');

        //Create multi-select element
        var $select = $('<select multiple="multiple" class="' + field.inputClass + '" id="Edit-' + fieldName + '" name=' + fieldName + '></select>')
            .appendTo($containerDiv);

        var options = this._getOptionsForField(fieldName, {
            record: record,
            source: source,
            form: form,
            dependedValues: this._createDependedValuesUsingForm(form, field.dependsOn)
        });

        this._fillDropDownListWithOptions($select, options, value);

        return $containerDiv;
    }

prxmt added 6 commits May 6, 2014 13:05
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:
volosoft#52
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()
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)
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants