Kendo has added a new API method called expandPath to its treeView in Q3 2013. Unfortunately I can't find any documentation about it in Kendo UI Docs or its forums.
Has anybody used this method? A sample would be great.
Well, it lets you expand a path and provide a callback that is called once all nodes are expanded:
var tree = $("#treeview").kendoTreeView({
dataSource: [{
id: 0,
text: "Furniture",
items: [{
id: 1,
text: "Tables & Chairs"
}, {
id: 2,
text: "Sofas"
}, {
id: 3,
text: "Occasional Furniture",
items: [{
id: 8,
text: "Small Sofas"
}, {
id: 9,
text: "Tiny Sofas",
items: [{
id: 10,
text: "Small Tiny Sofas"
}, {
id: 11,
text: "Smallest Tiny Sofas"
}]
}]
}]
}, {
id: 4,
text: "Decor",
items: [{
id: 5,
text: "Bed Linen"
}, {
id: 6,
text: "Curtains & Blinds"
}, {
id: 7,
text: "Carpets"
}]
}]
}).data().kendoTreeView;
tree.expandPath([0, 3, 9], function() {
console.log("hello");
});
The first parameter is an array of node ids describing the path (in the order you would expand them manually). The second parameter is a callback (this parameter is optional) which is probably mainly useful when additional nodes are loaded from a server (the callback doesn't seem to get called if the last node in the array is a leaf node though).
(see demo)
Related
I'm trying to implement a basic multiselect dropdown to my project. My code is the following:
HTML
<ng-multiselect-dropdown [settings]="searchSettings" [data]="dummyList" multiple>
</ng-multiselect-dropdown>
TS
dummyList = [
{ item_id: 1, item_text: 'Mumbai' },
{ item_id: 2, item_text: 'Bangaluru' },
{ item_id: 3, item_text: 'Pune' },
{ item_id: 4, item_text: 'Navsari' },
{ item_id: 5, item_text: 'New Delhi' }
]
searchSettings: TslMultiSelectSettings = {
enableSearchFilter: true,
noDataLabel: 'Search For status',
labelKey: 'status',
primaryKey: 'status'
}
This successfully creates the dropdown with the correct amount of items. But it is showing up blank and I can't figure out why. See image:
When I inspect the element in devtools I can see that the names are the options are there too:
What am I doing that is making the text not appear and how can I fix?
Check the docs, the format is: { id: number|string, text: string }.
Update
I'm not even sure if you're using the same library as the one I linked. But if you are, you can use it like this:
dummyList = [
{ id: 1, text: 'Mumbai' },
{ id: 2, text: 'Bangaluru' },
{ id: 3, text: 'Pune' },
{ id: 4, text: 'Navsari' },
{ id: 5, text: 'New Delhi' }
]
<ng-multiselect-dropdown [data]="dummyList"></ng-multiselect-dropdown>
I have no idea where you are getting the following interface from, it doesn't match the library I'm referring to at the start of the answer, please confirm which npm library you are using.
searchSettings: TslMultiSelectSettings = {
enableSearchFilter: true,
noDataLabel: 'Search For status',
labelKey: 'status',
primaryKey: 'status'
}
This is the object, lets say I'm gonna add something inside list: [], how can I do that? I know like we can do it using the prevList callback but I'm kind of confused to map through it.
const [boardlist, setBoardlist] = useState([
{
id: 1,
boardName: "home work",
data: [
{
id: 1,
header: "Stuff to do",
list: [
{
id: 1,
taskTitle: "working from home",
},
],
},
{
id: 2,
header: "In Progress",
list: [],
},
{
id: 3,
header: "Done",
list: [],
},
],
},
]);
What about make a copy of the state and just push using the bracket notation and dot notation to reach the element that you need to change?
const boardlistCopy = JSON.parse(JSON.stringify(boardlist));
boardlistCopy[0].data[1].list.push({id: 2, task: "studying React"});
setBoardlist(boardlistCopy);
How to set the item in Angular JS Listbox. This should be shown as selected in Listbox.
HTML
<select multiple ="multiple" style="width:180px" ng-model="md_fruitpref" ng-options="fruit.Id as fruit.Name for fruit in Fruits"></select>
Controller
//Controller to set the items in Fruit
$scope.Fruits = [{
Id: 1,
Name: 'Apple'
}, {
Id: 2,
Name: 'Mango'
}, {
Id: 3,
Name: 'Orange'
}, {
Id: 4,
Name: 'Guava'
}, {
Id: 5,
Name: 'Banana'
}, {
Id: 6,
Name: 'Watermellon'
}];
This will fill the Listbox with the various fruits.
Now I want to show the webpage with all the fruits in the Listbox but selected with Apple and Watermellon. So I do this but it does not help.
$scope.md_fruitpref= [{
Id: 1,
Name: 'Apple',
Id: 6,
Name: 'Watermellon'
}];
How to set value in Angular JS Listbox?
Try:
// array with 2 elements (each one an object with the same properties)
$scope.md_fruitpref= [{
Id: 1,
Name: 'Apple'
}, {
Id: 6,
Name: 'Watermellon'
}];
The structure you currently have does not work because you only have one element in your md_fruitpref array, and the object is invalid because it uses the same keys twice.
Finally I found the answer to this.
It will be :-
$scope.md_fruitpref= [1,6];
After this line soon you will see the selection in Listbox
Response format:
const fakeDatabase = {
quizzes: [{
id: v4(),
title: 'Get started',
text: 'hey',
completed: true,
hints: [{
id: 1,
text: 'Hint 1'
}, {
id: 2,
text: 'Hint 2'
}]
}, {
id: v4(),
title: 'What are you waiting for?',
text: 'ho',
completed: true,
hints: [{
id: 3,
text: 'Hint 3'
}, {
id: 4,
text: 'Hint 4'
}]
}, {
id: v4(),
title: 'Remember! create more than you consume',
text: 'let’s go',
completed: false,
hints: [{
id: 5,
text: 'Hint 5'
}, {
id: 6,
text: 'Hint 6'
}]
}],
};
I have the following schema:
import { Schema, arrayOf } from 'normalizr';
export const hint = new Schema('hints');
export const quiz = new Schema('quizzes', {
hints: [ hint ]
});
export const arrayOfQuiz = arrayOf(quiz);
But after normalizing I get the following response:
normalize(response, schema.arrayOfQuiz)
So, basically my quiz is normalized properly but hints is kept as it is, I don't know if I am missing something.
It looks like you're using normalizr v2.x. Only in v3.0.0 was plain array syntaxt [ hint ] added. In v2.x, you need to use arrayOf(hint).
I have a server response that looks like this:
[{
id: 1,
title: 'Some Article',
related_articles: {
total: 4,
results: [
{ id: 2, title: 'Some other article' },
{ id: 3, title: 'Yet another article' },
]
}
}]
As you can see, what makes this tricky is it isn't a simple arrayOf: I want to normalize article.related_articles.results.
I've tried this, to no avail:
articleSchema.define({
related_articles: {
results: arrayOf(relatedArticleSchema),
},
});
It seems as though supported relations have to be "top level".
Anyone know how I can wind up with something like:
[{
id: 1,
title: 'Some Article',
related_articles: {
total: 4,
results: [2, 3]
}
}]
Thanks!
Your scheme defines a key "relatedArticles", but it should be snake_case, "related_articles"