I am implementing kendo treeview of checkboxes in angular. I get no error, but tree is not rendering. My code is here:
addCtrl.js
$scope.updateTree = function () {
websiteService.getWebsiteFeaturesTree(webName, function (data) {
$scope.treeOptions = {
checkboxes: {
checkChildren: true
}
};
$scope.treeDataSource = data;
});
}
add.html
<div kendo-tree-view k-options="treeOptions" k-data-source="treeDataSource"></div>
app.js
var app = angular.module('app', ['ui.bootstrap', 'ngRoute', 'kendo.directives']);
I get datasource from webservice. here is json
// 20160930204148
// http://localhost/api/Website/GetWebsiteFeaturesTree?webName=MetisEmptyTemplate
[
{
"Name": "Section",
"text": "Admin",
"checked": false,
"items": [
{
"Name": "Tab",
"text": "Matrix Analysis",
"checked": true,
"items": [
]
},
{
"Name": "Tab",
"text": "Risk Categories and Questions",
"checked": true,
"items": [
]
},
{
"Name": "Tab",
"text": "Risk Colors",
"checked": true,
"items": [
]
},
{
"Name": "Tab",
"text": "SWOT Types",
"checked": false,
"items": [
]
}
]
},
{
"Name": "Section",
"text": "Strategy",
"checked": false,
"items": [
{
"Name": "Tab",
"text": "SWOT Analysis",
"checked": false,
"items": [
{
"Name": "Grid",
"text": "SWOT Grid",
"checked": true,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": false,
"items": [
{
"Name": "Output",
"text": "SWOT Box",
"checked": false,
"items": [
]
}
]
}
]
}
]
},
{
"Name": "Section",
"text": "Portfolio",
"checked": true,
"items": [
{
"Name": "Tab",
"text": "Matrix",
"checked": true,
"items": [
{
"Name": "Grid",
"text": "Matrix Grid",
"checked": true,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": true,
"items": [
{
"Name": "Output",
"text": "Matrix Output",
"checked": true,
"items": [
]
}
]
}
]
},
{
"Name": "Tab",
"text": "Strategy",
"checked": true,
"items": [
{
"Name": "Grid",
"text": "Strategy Grid",
"checked": true,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": true,
"items": [
{
"Name": "Output",
"text": "Investment Level by Objective",
"checked": true,
"items": [
]
}
]
}
]
},
{
"Name": "Tab",
"text": "Risk",
"checked": true,
"items": [
{
"Name": "Grid",
"text": "Risk Grid",
"checked": true,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": true,
"items": [
{
"Name": "Output",
"text": "Portfolio Risk",
"checked": true,
"items": [
]
},
{
"Name": "Output",
"text": "Portfolio Risk Stacked Bar",
"checked": true,
"items": [
]
}
]
}
]
}
]
},
{
"Name": "Section",
"text": "Project",
"checked": false,
"items": [
{
"Name": "Tab",
"text": "Matrix",
"checked": true,
"items": [
{
"Name": "Grid",
"text": "Matrix Grid",
"checked": true,
"items": [
]
}
]
},
{
"Name": "Tab",
"text": "Strategy",
"checked": true,
"items": [
{
"Name": "Grid",
"text": "Strategy Grid",
"checked": true,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": true,
"items": [
{
"Name": "Output",
"text": "Project Tactic Linkage",
"checked": true,
"items": [
]
},
{
"Name": "Output",
"text": "OGTM",
"checked": true,
"items": [
]
}
]
}
]
},
{
"Name": "Tab",
"text": "Risk",
"checked": false,
"items": [
{
"Name": "Grid",
"text": "Risk Grid",
"checked": false,
"items": [
]
},
{
"Name": "Outputs",
"text": "Outputs",
"checked": true,
"items": [
{
"Name": "Output",
"text": "Risk Charts",
"checked": true,
"items": [
]
}
]
}
]
}
]
}
]
Although my data source is correct. What thing is missing in it? I am not getting any error. My tree is not rendering in html.
Try placing your data in a new kendo.data.HierarchicalDataSource
Related
I was able to find many sources saying how to filter nested arrays, but all of these referred to arrays within arrays. In my case, there's an array nested within an object and I can't figure out how to deal with it.
The source array is:
{
"msg": "OK",
"blueprint": {
"result": "OK",
"blueprint": {
"id": "a2e63ee01401aaeca78be023dfbb8c59",
"product": {
"productName": "Test Product",
"productId": "AS_12-01",
"description": "Test Descr.",
"childProducts": [
{
"childId": "T1",
"parent": "8c59"
},
{
"childId": "T5",
"parent": "8c7e"
}
],
"components": [
{
"compId": "C2", #
"leadTime": 21, # remove
"available": false #
},
{
"compId": "C5",
"leadTime": 3,
"available": true
},
{
"compId": "C6", #
"leadTime": 12, # remove
"available": false #
},
{
"compId": "C8",
"leadTime": 5,
"available": true
},
]
},
"owner": "dummy",
"name": "du_test"
}
}
}
How to filter the nested array so that the resulting object looks like:
{
"msg": "OK",
"blueprint": {
"result": "OK",
"blueprint": {
"id": "a2e63ee01401aaeca78be023dfbb8c59",
"product": {
"productName": "Test Product",
"productId": "AS_12-01",
"description": "Test Descr.",
"childProducts": [
{
"childId": "T1",
"parent": "8c59"
},
{
"childId": "T5",
"parent": "8c7e"
}
],
"components": [
{
"compId": "C5",
"leadTime": 3,
"available": true
},
{
"compId": "C8",
"leadTime": 5,
"available": true
},
]
},
"owner": "dummy",
"name": "du_test"
}
}
}
So, basically the structure is the same, only the nested array has the unavailable objects removed.
How to achieve it?
you can simply reassign the field with the filtered array
const x = { "msg": "OK", "blueprint": { "result": "OK", "blueprint": { "id": "a2e63ee01401aaeca78be023dfbb8c59", "product": { "productName": "Test Product", "productId": "AS_12-01", "description": "Test Descr.", "childProducts": [ { "childId": "T1", "parent": "8c59" }, { "childId": "T5", "parent": "8c7e" } ], "components": [ { "compId": "C2", "leadTime": 21, "available": false }, { "compId": "C5", "leadTime": 3, "available": true }, { "compId": "C6", "leadTime": 12, "available": false }, { "compId": "C8", "leadTime": 5, "available": true }, ] }, "owner": "dummy", "name": "du_test" } }}
x.blueprint.blueprint.product.components = x.blueprint.blueprint.product.components.filter(({available}) => available)
console.log(x)
I'm a beginner to JavaScript code, but I'm currently developing a Discord bot to host an interactive escape room type event for my Discord community. I know how to add cooldowns on prefix commands for individual users, but I was wondering if it'd be possible to have a cooldown for a command as a whole that is in place for the server simultaneously? This way, during the event the same command isn't spammed when it only needs to be activated once.
Here is the code for the command I'd like to have the cooldown attached
const lib = require('lib')({token: process.env.STDLIB_SECRET_TOKEN});
await lib.discord.channels['#0.3.0'].messages.create({
"channel_id": `${context.params.event.channel_id}`,
"content": "",
"tts": false,
"components": [
{
"type": 1,
"components": [
{
"style": 3,
"label": `Pick Up!`,
"custom_id": `peice_1`,
"disabled": false,
"type": 2
}
]
}
],
"embeds": [
{
"type": "rich",
"title": `Peice 1 📄`,
"description": `Only 1 person can pick up each peice`,
"color": 0x5cd964
}
]
});
await lib.discord.channels['#0.3.0'].messages.create({
"channel_id": `${context.params.event.channel_id}`,
"content": "",
"tts": false,
"components": [
{
"type": 1,
"components": [
{
"style": 3,
"label": `Pick Up!`,
"custom_id": `peice_2`,
"disabled": false,
"type": 2
}
]
}
],
"embeds": [
{
"type": "rich",
"title": `Peice 2 📄`,
"description": `Only 1 person can pick up each peice`,
"color": 0xfffaed
}
]
});
await lib.discord.channels['#0.3.0'].messages.create({
"channel_id": `${context.params.event.channel_id}`,
"content": "",
"tts": false,
"components": [
{
"type": 1,
"components": [
{
"style": 3,
"label": `Pick Up!`,
"custom_id": `peice_3`,
"disabled": false,
"type": 2
}
]
}
],
"embeds": [
{
"type": "rich",
"title": `Peice 3 📄`,
"description": `Only 1 person can pick up each peice`,
"color": 0xfffaed
}
]
});
await lib.discord.channels['#0.3.0'].messages.create({
"channel_id": `${context.params.event.channel_id}`,
"content": "",
"tts": false,
"components": [
{
"type": 1,
"components": [
{
"style": 3,
"label": `Pick Up!`,
"custom_id": `peice_4`,
"disabled": false,
"type": 2
}
]
}
],
"embeds": [
{
"type": "rich",
"title": `Peice 4 📄`,
"description": `Only 1 person can pick up each peice`,
"color": 0xfffaed
}
]
});
await lib.discord.channels['#0.3.0'].messages.create({
"channel_id": `${context.params.event.channel_id}`,
"content": "",
"tts": false,
"components": [
{
"type": 1,
"components": [
{
"style": 3,
"label": `Pick Up!`,
"custom_id": `peice_5`,
"disabled": false,
"type": 2
}
]
}
],
"embeds": [
{
"type": "rich",
"title": `Peice 5 📄`,
"description": `Only 1 person can pick up each peice`,
"color": 0xfffaed
}
]
});
I have a scenario were need to iterate over each children element of the tree structure and modify/add properties or attributes. Each children can have multiple children
var treeStructure = {
"id": 1,
"name": "Grand Parent 1",
"children": [
{
"id": 2,
"children": [
{
"id": 3,
"children": [],
"name": "Child 11",
"properties": [
{
"id": 15,
"run": "fast"
},
{
"id": 16,
"walk": "slow"
}
]
},
{
"id": 4,
"type": "Child",
"children": [],
"name": "Child 12",
"properties": [
{
"id": 17,
"run": "slow"
},
{
"id": 18,
"walk": "medium"
}
]
}
],
"name": "Parent 1",
"properties": [
{
"id": 12,
"run": "slow"
},
{
"id": 13,
"walk": "fast"
}
]
},
{
"id": 5,
"children": [
{
"id": 6,
"children": [],
"name": "Child 21"
}
],
"name": "Parent 2",
"properties": [
{
"id": 21,
"run": "medium"
},
{
"id": 22,
"walk": "fast"
}
]
},
{
"id": 7,
"type": "Parent",
"children": [
{
"id": 8,
"children": [],
"name": "Child 31"
}
],
"name": "Parent 3",
"properties": [
{
"id": 31,
"run": "fast"
},
{
"id": 32,
"walk": "slow"
}
]
}
]
}
iterateTree(treeStructure)
iterateTree (node) {
var self = this;
function recursive(obj) {
if (obj.children && obj.children.length) {
obj.children.forEach(function(val,key){
if(val.hasOwnProperty("children")){
self.modifyProperties(val);
recursive(val.children);
}
})
}
}
var expectedOutput = recursive(node);
console.log(expectedOutput)
}
modifyProperties(nodeData) {
let thingProperties = [];
if (nodeData.properties) {
nodeData.properties.map(function (property) {
let tempObj = {
"id": null,
"actionType": "create",
"run" : property.run
};
thingProperties.push(tempObj);
})
}
return {
"id": nodeData.id,
"name": nodeData.name,
"actionType": "create",
}
}
Expected Output: I should be able to modify "id" as null and add
"actionType" as create for children and parent element as shown below
{
"id": 1,
"name": "Grand Parent 1",
"actionType": "create",
"children": [
{
"id": 2,
"actionType": "create",
"children": [
{
"id": 3,
"children": [],
"name": "Child 11",
"actionType": "create",
"properties": [
{
"id": null,
"run": "fast",
"actionType": "create",
"read": "slow"
},
{
"id": null,
"actionType": "create",
"walk": "slow",
"write": "fast"
}
]
},
{
"id": 4,
"type": "Child",
"children": [],
"name": "Child 12",
"actionType": "create",
"properties": [
{
"id": null,
"actionType": "create",
"run": "slow"
},
{
"id": null,
"actionType": "create",
"walk": "medium"
}
]
}
],
"name": "Parent 1",
"actionType": "create",
"properties": [
{
"id": null,
"actionType": "create",
"run": "slow"
},
{
"id": null,
"actionType": "create",
"walk": "fast"
}
]
},
{
"id": 5,
"children": [
{
"id": null,
"children": [],
"name": "Child 21"
}
],
"name": "Parent 2",
"actionType": "create",
"properties": [
{
"id": null,
"actionType": "create",
"run": "medium"
},
{
"id": null,
"walk": "fast"
}
]
},
{
"id": 7,
"type": "Parent",
"actionType": "create",
"children": [
{
"id": null,
"actionType": "create",
"children": [],
"name": "Child 31"
}
],
"name": "Parent 3",
"properties": [
{
"id": null,
"actionType": "create",
"run": "fast"
},
{
"id": null,
"actionType": "create",
"walk": "slow"
}
]
}
]
}
I am parsing the json .I am checking json array and after that make another object .I just struck in one place.Actually I am checking that if parent have child I add one object in "testCaseList "array that against child .But I need to check if child id have character "not" it should add in this array "commandList"
http://jsfiddle.net/tJ7Kq/5/
Here is my input .
[
{
"id": "a",
"text": "a",
"icon": true,
"li_attr": {
"id": "a"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
},
{
"id": "b",
"text": "b\n ",
"icon": true,
"li_attr": {
"id": "b"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
{
"id": "b-a-1",
"text": "b-a",
"icon": true,
"li_attr": {
"id": "b-a-1"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
},
{
"id": "b-b-2",
"text": "b-b\n ",
"icon": true,
"li_attr": {
"id": "b-b-2"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
{
"id": "b-b-a",
"text": "b-b-a",
"icon": true,
"li_attr": {
"id": "b-b-a"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
},
{
"id": "b-b-b",
"text": "b-b-b",
"icon": true,
"li_attr": {
"id": "b-b-b"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
}
]
}
]
},
{
"id": "c-1",
"text": "c\n ",
"icon": true,
"li_attr": {
"id": "c-1"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
{
"id": "not-c-a-1",
"text": "c-a",
"icon": true,
"li_attr": {
"id": "not-c-a-1"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
},
{
"id": "not-c-b-2",
"text": "b-b",
"icon": true,
"li_attr": {
"id": "not-c-b-2"
},
"a_attr": {
"href": "#"
},
"state": {
"loaded": true,
"opened": false,
"selected": false,
"disabled": false
},
"data": {
},
"children": [
]
}
]
}
]
getting out put this
[
{
"a": {
"commandList": [],
"testCaseList": []
}
},
{
"b": {
"commandList": [],
"testCaseList": [
{
"b-a-1": {
"commandList": [],
"testCaseList": []
}
},
{
"b-b-2": {
"commandList": [],
"testCaseList": [
{
"b-b-a": {
"commandList": [],
"testCaseList": []
}
},
{
"b-b-b": {
"commandList": [],
"testCaseList": []
}
}
]
}
}
]
}
},
{
"c-1": {
"commandList": [],
"testCaseList": [
{
"not-c-a-1": {
"commandList": [],
"testCaseList": []
}
},
{
"not-c-b-2": {
"commandList": [],
"testCaseList": []
}
}
]
}
}
]
Expected out put is :
[
{
"a": {
"commandList": [],
"testCaseList": []
}
},
{
"b": {
"commandList": [],
"testCaseList": [
{
"b-a-1": {
"commandList": [],
"testCaseList": []
}
},
{
"b-b-2": {
"commandList": [],
"testCaseList": [
{
"b-b-a": {
"commandList": [],
"testCaseList": []
}
},
{
"b-b-b": {
"commandList": [],
"testCaseList": []
}
}
]
}
}
]
}
},
{
"c-1": {
"commandList": [
{
"not-c-a-1": {
"commandList": [],
"testCaseList": []
}
},
{
"not-c-b-2": {
"commandList": [],
"testCaseList": []
}
}],
"testCaseList": []
}
}
]
This mapItem function will do what you need:
function mapItem(inputItem) {
var item = {};
item[inputItem.id] = JSON.parse(sessionStorage.getItem(inputItem.id));
for (k in inputItem.children) {
if (/^not-/.test(inputItem.children[k].id)) {
item[inputItem.id].commandList.push(mapItem(inputItem.children[k]));
}else{
item[inputItem.id].testCaseList.push(mapItem(inputItem.children[k]));
}
}
return item;
}
can you please tell me how to validate form which is prepared dynamically using dfom plugin?
I used jquery validation but it don't work on chrome.
can you please tell me why dform with jquery validation not working in chrome ?.It is working fine in firefox but not with in chrome why ?? Here is http://jsfiddle.net/8bweG/13/?
$("#sform").dform(
{
"elements": [
{
"html": [
{
"html": [
{
"type": "number",
"id": "totalRetryCount",
"name": "totalRetryCount",
"required": false,
"value": 0,
"tabindex": 1,
"validate": {
"messages": {
"number": "Naveen Kanjush hain"
}
}
}
],
"type": "fieldset",
"caption": "Total Retry Count"
},
{
"html": [
{
"type": "number",
"id": "totalRepeatCount",
"name": "totalRepeatCount",
"required": false,
"value": 0,
"tabindex": 2,
"validate": {
"messages": {
"number": "Naveen Kanjush hain"
}
}
}
],
"type": "fieldset",
"caption": "Total Repeat Count"
},
{
"html": [
{
"type": "select",
"options": {
"true": "true",
"false": "false"
},
"id": "summaryReportRequired",
"name": "summaryReportRequired",
"required": false,
"value": "true",
"tabindex": 3,
}
],
"type": "fieldset",
"caption": "Summary Report Required"
},
{
"html": [
{
"type": "select",
"options": {
"ALWAYS": "ALWAYS",
"ON_SUCCESS": "ON_SUCCESS"
},
"id": "postConditionExecution",
"name": "postConditionExecution",
"required": false,
"value": "ON_SUCCESS",
"tabindex": 4,
}
],
"type": "fieldset",
"caption": "Post Condition Execution"
}
],
"type": "div",
"class": "inputDiv",
"caption": "<h3>Configuration Parameters</h3>"
}
],
"id": "testSuiteConfigurationform",
"name": "testSuiteConfigurationform",
"method": "post"
}
);
Problem is that
First field of type ="number".User only type number in that .If user type string or character and move to another field it gives error.if you check on firefox this fiddle it is giving validation error .But on chrome and safari same functionality not work.
please follow these steps
on first field write "abc" then click below or next field.it gives error front of first field.it is display on firefox but not on chrome
It is working but you are missing the Submit button.
This is the correct version: http://jsfiddle.net/8bweG/22/
$("#sform").dform({
"action" : "http://dgg.gg",
"method" : "get",
"elements": [
{
"html": [
{
"html": [
{
"type": "number",
"id": "totalRetryCount",
"name": "totalRetryCount",
"required": false,
"value": 0,
"tabindex": 1,
"validate": {
"messages": {
"number": "Naveen Kanjush hain"
}
}
}
],
"type": "fieldset",
"caption": "Total Retry Count"
},
{
"html": [
{
"type": "number",
"id": "totalRepeatCount",
"name": "totalRepeatCount",
"required": false,
"value": 0,
"tabindex": 2,
"validate": {
"messages": {
"number": "Naveen Kanjush hain"
}
}
}
],
"type": "fieldset",
"caption": "Total Repeat Count"
},
{
"html": [
{
"type": "select",
"options": {
"true": "true",
"false": "false"
},
"id": "summaryReportRequired",
"name": "summaryReportRequired",
"required": false,
"value": "true",
"tabindex": 3,
}
],
"type": "fieldset",
"caption": "Summary Report Required"
},
{
"html": [
{
"type": "select",
"options": {
"ALWAYS": "ALWAYS",
"ON_SUCCESS": "ON_SUCCESS"
},
"id": "postConditionExecution",
"name": "postConditionExecution",
"required": false,
"value": "ON_SUCCESS",
"tabindex": 4,
}
],
"type": "fieldset",
"caption": "Post Condition Execution"
},
{
"html": [
{
"type" : "submit",
"value" : "Login"
}
],
"type": "fieldset",
"caption": "Go away"
}
],
"type": "div",
"class": "inputDiv",
"caption": "<h3>Configuration Parameters</h3>"
}
],
"id": "testSuiteConfigurationform",
"name": "testSuiteConfigurationform",
"method": "post"
}
);