Adding multiple selected values from an array to a Kendo Multi Select - kendo-ui

Background:
I getting values from a db that will be needed to be pre-selected in a kendo multi select. I am able to do this with one word, however when the return value from the DB is multiple words I run into problems.
Problem:
I am not able to populate pre-selected values in my kendo multi select. In the best cases when I only get one returned word I am able to run these two lines var value = multiSelect.value(); multiSelect.value(["test"]); and the multi select would be populated with the test selection. However when I do multiple values from an array, it does not work the same way.
Code:
var keyWordPool = [{Words: "Test"},{Words: "Test2"}, {Words: "Test3"},
{Words: "Test4"},{Words: "Test5"}];
var returnedWords = ["Test","Test4", "Test5"]; **<< This does not work**
var returnedWords = ["Test"]; **<< This does work**
CreateandPopulateMultiSelect(keyWordPool, returnedWords)
function CreateandPopulateMultiSelect(dataSource, wordsToPopulate)
{
var multiSelect = $(".PanelMultiSelect").kendoMultiSelect({
dataSource: dataSource,
filter: "contains",
dataTextField: "Words",
dataValueField: "Words",
select: function (e) {
var item = e.item;
var text = item.text();
var stop = 0;
}
}).data("kendoMultiSelect");
var value = multiSelect.value();
multiSelect.value([wordsToPopulate]);
}
Objective:
I am not able to control the amount of words that come back from the DB, so I will need to be able to add multiple words at any given time, as well as one word. I will need to have wordsToPopulate to already be selected when a person opens a panel bar.

Well, I can't tell you exactly what is happening internally in kendo, but your wordsToPopulate variable is already an array when you pass it in to CreateandPopulateMultiSelect(). If you change
multiSelect.value([wordsToPopulate]);
to
multiSelect.value(wordsToPopulate);
it should work.
http://dojo.telerik.com/#Stephen/aMEma

Related

Oracle APEX Interactive Grid: Is there a way to get the corresponding column name, when clicking in a data cell in the Interactive Grid

I have a Dynamic Action which should get the data from the model, depending on the clicked column. Let 's say I have two columns in the interactive grid, column A and B. Depending on the column I clicked in, the DA should be executed and execute a query with the value from column A or B.
The DA is actived on doubleclick and I have the following source to get the value from the IG model.
var regionStaticId = $(this.triggeringElement).closest("div.js-apex-region").attr('id');
var grid = apex.region( regionStaticId ).widget().interactiveGrid("getViews", "grid");
var model = grid.model;
var record = grid.getSelectedRecords()[0];
var value;
// Code to find the the clicked column comes here
if (record) {
value = model.getValue(record, columnName);
}
Now, what I can do is add an extra css class to the particular cells, with the name of the source column. But that would be like hardcoding in my opinion. Like this.
if ($(this.triggeringElement).hasClass('columnA')) {
columnName = 'COLUMN_A';
}
else if ($(this.triggeringElement).hasClass('columnB')) {
columnName = 'COLUMN_B';
}
Is there a way to determine the clicked column, based on the triggering element?
Help is very much appreciated.

Multiple dependent dynamic dropdowns with repeating column dropdowns in Google Sheets

The Google Sheet I have uses code made by user Max Makhrov, code here, to make multiple dependent dynamic dropdowns in columns D-F (for location) and columns H-L (for objectives & activities) in my sample sheet here.
I would like help to modify the script to do two things:
Whatever activity is selected from the dropdown menu in Column I, I would like the same dropdown menu options to be available (to repeat) for columns J-L. As you can see I found a way to do it, but to me it seems clunky and not ideal, and leaves too much room for errors. Users should not select the activity twice, but I've put conditional formatting in to flag that if they do. However:
Ideally, but less importantly, if the dropdown menu items could still repeat for columns J-L but once an activity is selected in previous cells, that option is removed from each of the following repeated dropdown menus in additional columns, up to and including column L. This would help avoid accidentally repeating an activity.
NB: Reference question "How do you do dynamic / dependent drop downs in Google Sheets?"
Thank You!
When one of the drop-down cells is edited you can use an onEdit trigger [1] to iterate through the 4 columns (I-L) and update the drop-downs in each cell removing the option selected in the edited cell. You also need to add the old selected value (previously deleted from other options) to the other drop-downs. For this, you can use getDataValidation [2] and getCriteriaValues [3] functions chained to a Range object to retrieve the current drop-down values array on that range and delete the option matching with the selected option.
Use newDataValidation() [4] function to create a new rule using your updated drop-down values array and setDataValidation [5] function to set the rule to the range.
function onEdit(event) {
var range = event.range;
var sheetName = range.getSheet().getSheetName();
var col = range.getColumn();
var newValue = event.value;
var oldValue = event.oldValue;
//If the edited range is in sheet '3W' and beetween columns I-L
if(sheetName == '3W') {
if(col>=9 && col<=12) {
for(var i=9; i<13; i++) {
//Don't change anything for edited cell
if(col == i) { continue; }
else {
//Get range to update and current dropdown values for that range
var rangeToUpdate = range.getSheet().getRange(range.getRow(), i, 1, 1);
var dropdownValues = rangeToUpdate.getDataValidation().getCriteriaValues()[0];
//Find new edited value and delete it from options array
var index = dropdownValues.indexOf(newValue);
if (index > -1) {
dropdownValues.splice(index, 1);
}
//If previous selected value is not beetween the options, add it
if(oldValue && dropdownValues.indexOf(oldValue) == -1) {
Logger.log(oldValue)
dropdownValues.push(oldValue);
}
//Set new dropdown values to range
var updatedRule = SpreadsheetApp.newDataValidation().requireValueInList(dropdownValues, true).setAllowInvalid(false);
rangeToUpdate.setDataValidation(updatedRule);
}
}
}
}
}
Run just the first time to set all the drop-downs in columns I-L, which are get it from range E1:E10:
function setDropdownsInitially() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
//Range with the dropdown values
var sheet = ss.getSheetByName("indicators");
var dropdownValues = sheet.getRange("E1:E10").getValues();
//Data validation rule
var rule = SpreadsheetApp.newDataValidation().requireValueInList(dropdownValues, true).setAllowInvalid(false);
//Range where the dropdowns will be created
var targetSheet = ss.getSheetByName("3W");
var cells = targetSheet.getRange("I2:L");
//Set data validation rule
cells.setDataValidation(rule);
}
[1] https://developers.google.com/apps-script/guides/triggers/events#google_sheets_events
[2] https://developers.google.com/apps-script/reference/spreadsheet/range#getdatavalidation
[3] https://developers.google.com/apps-script/reference/spreadsheet/data-validation-builder.html#getcriteriavalues
[4] https://developers.google.com/apps-script/reference/spreadsheet/spreadsheet-app#newdatavalidation
[5] https://developers.google.com/apps-script/reference/spreadsheet/range#setdatavalidationrule

Have Google Sheet Linked to Google Form Sort By Date Automatically

I use a Google Form for people to request days off. An add-on called Form Approvals is used to send emails to certain people who can approve or deny the request. In the Google Sheet listing the responses, new entries keep going to the bottom.
Is there a way to make new entries from the Google Form to be sorted automatically by the date of the day off in the Google Sheet?
I found this script, but it doesn't work:
function onEdit(event){
var sheet = event.source.getActiveSheet();
var editedCell = sheet.getActiveCell();
var columnToSortBy = 2;
var tableRange = sheet.getDataRange();
if(editedCell.getColumn() == columnToSortBy){
var range = sheet.getRange(tableRange);
range.sort( { column : columnToSortBy } );
}
}
Also, is there a way to specify which sheet tab for the script to run on?
Try this:
function onEdit(e){
var sh=e.range.getSheet();
if(sh.getName()!="Your desired sheet name")return;
if(e.range.columnStart==2){
sh.getDataRange().sort({ column:2});
}
}
A lot of new programmers try to run these onEdit(e) functions from the script editor. Unfortunately, that doesn't work because the e parameter is expecting to be populated by the event trigger. Without the event object you'll normally get an error like Cannot read property range from undefined because e has not been populated by the event trigger.
I test them by making sure I'm editing the correct sheet and correct range and I use the e.source.toast() function to provide me with feed back sort of like the console.log() does.
If you want to learn more about the event object then try adding a Logger.log(JSON.stringify(e)); to the first line after the function declaration. And then get it to run by editing the appropriate sheet in the appropriate way and go to view log to see the results.
If your sheet is populated by a form and you want to sort the data every time a new form is submitted - you need to use the onFormSubmit trigger.
Google Forms populates the destination spreadsheet chronologically, in order to avoid interference you can use a sync sheet to which the data is transferred on every form submit and which you can sort as desired.
Sample:
function myFunction() {
var ss=SpreadsheetApp.getActiveSpreadsheet();
var sheet=ss.getActiveSheet();
if(sheet.getName()=="Name of Tab to copy and sort"){
var lastRow=sheet.getLastRow();
var lastCol=sheet.getLastColumn();
var range=sheet.getRange(lastRow,1,1,lastCol);
var secondarySheetId="XXX";//Paste here the Id of the secondary spreadsheet
var secondarySheet=SpreadsheetApp.openById(secondarySheetId).getSheetByName("Name of tab of your choice");
secondarySheet.getRange(secondarySheet.getLastRow()+1,1,1,lastCol).setValues(range.getValues());
SpreadsheetApp.flush();
var secondaryRange = secondarySheet.getDataRange();
var columnToSortBy=2; //adapt to your needs
secondaryRange.sort( { column : columnToSortBy } );
}
}
Atach this script to the destination spreadsheet, insert the Id of a secondary spreadsheet (which you have to create first), save the script and bind an installable onFormSubmit trigger to the script through Edit->Current project's triggers->New trigger.
I figured it out using https://www.idiotinside.com/2018/06/08/sort-multiple-columns-google-sheets-apps-script/ :)
For my spreadsheet:
The name of the sheet I want to sort (not every sheet in the spreadsheet) is called "Requests".
Dates are in Column B which is column number 2.
Dates are sorted with oldest at the top.
Be sure to edit SHEET_NAME, SORT_DATA_RANGE, and SORT_ORDER to your needs.
Use this script with an onEdit trigger:
SHEET_NAME = "Requests";
SORT_DATA_RANGE = "A2:L1500";
SORT_ORDER = [
// {column: 1, ascending: true}, // 1 = column number for Column A, sorting by ascending order
// {column: 3, ascending: false}, // 3 = column number for Column C, sorting by descending order
{column: 2, ascending: true},
];
function onEdit(e){
multiSortColumns();
}
function multiSortColumns(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheetByName(SHEET_NAME);
var range = sheet.getRange(SORT_DATA_RANGE);
range.sort(SORT_ORDER);
ss.toast('Sorting by Date completed.');
}
Then go to https://script.google.com/ and create a trigger for the above script. Under "Select event type" use "On form submit".
This is working well so far :)

How in webix datatable columns of same category to be put adjacent while copying them

In my Webix application, I have two datatables under separate tabs.
The columns of second table is same as first table with few extra columns.
While copying columns of first table to second, how can I align all editable columns at the end (on the extreme RHS) of the second datatable ?
Here is my snippet : https://webix.com/snippet/3ca44a3e
Thanks.
I have found a work around in JavaScript only by this following piece of code which rearranges the columns to put the editable ones at the end.
However, any better approach is most welcome:
var uneditable_cells = [];
var editable_cells = [];
for (var i in mycols2) {
var header = mycols2[i];
if(header.hasOwnProperty('editor')) {
editable_cells.push(header);
} else {
uneditable_cells.push(header);
}
}
mycols2 = uneditable_cells.concat(editable_cells);
Thanks.

How to set default drop down list value from another drop down list in sheets?

Here is what I am trying to do. I have a list that populates a drop down list created by data validation. I then query the data to populate a second list based on the first drop down value. Everything works except I would like to set the first value in the second drop down to be the default value. In other words if I change the value in the first drop down my second drop down now shows an error until I select the drop down and change the value to a correct value. I would like to set it to the first correct value when the first drop down is changed. My reason for this is I dont want someone to forget to change the second drop down and get a value that is not even in the range.
Please help I am new to this kind of thing.
thanks
https://docs.google.com/spreadsheets/d/1U2_0Ku1bCLfDh_v2XyE9aQMSfdYmlVfX_8SKmQay48g/edit?usp=sharing
Here is what I have so far. It works except anytime the sheet is edited the value is reset. I only want it to reset when Cell A2 changes.
function onEdit() {
var ss = SpreadsheetApp.getActive()
var sheet = SpreadsheetApp.getActiveSheet();
// IF(cellContent has changed) then clear B2
// else do nothing.
sheet.getRange('B2').clearContent();
var value = sheet.getRange('H2').getValue();
sheet.getRange('B2').setValue(value);
}
I figured it out and this seems to work just fine.
function onEdit() {
var sheet = SpreadsheetApp.getActiveSheet();
var cell = sheet.getActiveCell();
var cellR = cell.getRow();
var cellC = cell.getColumn();
var cellValue = cell.getValue();
var active_spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
var value = active_spreadsheet.getRange('H2').getValue();
if (cellR == 2 && cellC == 1) {
sheet.getRange('B2').clearContent();
sheet.getRange('B2').setValue(value);
}
}

Resources