I'm using the GetOrgChart JQuery plugin and running into a JavaScript error of:
Uncaught Type Error: Cannot read property '_ap' of null
I was able to determine that this is occurring in the case from my dataset where a user occurs earlier in the list than their manager does. My hierarchy is based around NTLogins, so the NTLogin of a given user is the id and the parentId is their manager's NTLogin.
$("#people").getOrgChart({
primaryColumns: ["Name"],
dataSource: [{
id: "bobeans125",
parentId: null,
Name: "Bob Beans"
}, {
id: "franklin884",
parentId: "tdawl756",
Name: "Frank Lin"
}, {
id: "tdawl756",
parentId: "bobeans125",
Name: "Tim Dawl"
}]
});
JSFIDDLE Demo
I have no good way that I can think of to order the data so that this doesn't occur other than finding all of the many root nodes and drilling down into the hierarchy manually so that the dataset being sent to GetOrgChart is ordered. However, the assumption of not having to do so was the primary driver for choosing GetOrgChart.
I ended up just recursively walking the tree and building the object in the right order. I was able to get it to load without error, however, the tree is too large to be displayed and requires being zoomed out too far to be useful.
Id : and ParentId: is integer value but you gave string value so your output is Error: Cannot read property '_ap' of null.
Correct Example:
$("#people").getOrgChart({
primaryColumns: ["Name"],
dataSource: [{
id: 1,
parentId: null,
Name: "Bob Beans"
}, {
id: 2,
parentId: 1,
Name: "Frank Lin"
}, {
id: "3",
parentId: "1",
Name: "Tim Dawl"
}]
});
Related
Hey sorry if this has been asked before, I haven't found an answer that has helped me.
I am working on building a personal application using the free Ticketmaster application but I'm having trouble with the JSON response.
An example of the response is:
data: {
classifications: [
type: {
id: 1,
name: "Dont want this"
}
],
[
type: {
id: 2,
name: "Dont want this"
}
],
[
category: {
id: 3,
name: "Food & Drink"
}
],
[
category: {
id: 4,
name: "Music"
]
}
I am trying to retrieve category names such as "Family", "Food & Drink", "Music" etc but only at some indexes does the array have category objects, the others have type.
Can someone tell me how to go through this array and only get the name when it is at category.name?
Any help is appreciated :)
looking around for a solution for my problem!
I try to make Vue.Draggable work with VueFire. I have a few lists with cards that can be dragged between them, sorted, cloned and so on. While the lists are populated with cards Vue.Draggable works perfectly, it watches for changes, triggers events like magic.
This is the working JSON:
categories: [{
name: "todo",
cards: ["second","first","second"]
},{
name: "doing"
cards: ["first","fourth","second"]
},{
name: "done",
cards: ["second", "fourth","first","third"]
}]
The problem comes when one o the lists is empty. We all know that Firebase doesn't store empty properties that's why Vue.Draggable can't watch for a property that doesn't exist. For example like this:
categories: [{
name: "todo",
cards: ["second","first","second"]
},{
name: "doing"
// missing cards property because it's empty
},{
name: "done",
cards: ["second", "fourth","first","third"]
}]
The cards property should be filled with values by dragging items to the list, but because cards doesn't exist Vue.Draggable can't watch for changes in that list and can't trigger events.
Is there a way to create some kind of placeholder or middleware to simulate that empty array? Or what are other possible solutions in this case?
Here's a small JSFiddle.
Thank you!
Why don't you initialize the cards property if nothing is returned from firebase?
categories: [{
name: "todo",
cards: ["second","first","second"]
},{
name: "doing",
cards: firebaseCollectionProperty || []
},{
name: "done",
cards: ["second", "fourth","first","third"]
}]
I'm trying to figure out the best way for my Redux Store to handle lists. Right now it looks like this:
Store = {
users: [],
posts: [],
lists: [],
}
My problem with this, is the list array. Essentially it's a store for paginated lists of a specific resource, so for example:
lists: [
{
id: 'users/43/posts',
items: [25, 36, 21]
}
]
Since I am using the url as the id, my component that shows a user's list of posts will know exactly which list to display. Now someone has told me that, this is a very very bad idea. And I just want some advice on what could be better. Another approach suggested was this:
users: [{
id: 2,
posts: [
{
url: 'users/2/posts',
items: [13, 52, 26],
}
]
}]
So what I don't understand, how does Redux know where to save this list? Do I have to specify in the action arguments where to save it?
Thank you for your advice.
Well, technically, anything works if you make it work! The second approach looks more mature, though. You don't want to use URLs as ID. IDs should be numbers or special sequence of characters+numbers. When your application grows, you'll want to normalize your data i.e. store the IDs in a separate array and transform the array of objects into an object with keys as ID.
Example from Normalizr
[{
id: 1,
title: 'Some Article',
author: {
id: 1,
name: 'Dan'
}
}, {
id: 2,
title: 'Other Article',
author: {
id: 1,
name: 'Dan'
}
}]
can be normalized to -
{
result: [1, 2],
entities: {
articles: {
1: {
id: 1,
title: 'Some Article',
author: 1
},
2: {
id: 2,
title: 'Other Article',
author: 1
}
}
}
}
When your application grows, you'll have multiple reducers and sub-reducers. You'll want to slice a specific portion of your state-tree and so on. For that reason someone might have advised you to store your state in a different manner.
But again, anything works if you make it work! Good luck!
I have successfully implement type ahead using angular js using this codepen.
Now my data is dynamic so I want to create my own json that should looks something like following:
$scope.states = [
{
name: "ABCD",
id: "AB"
},
{
name: "XYZ",
id: "XY"
},
{
name: "OPQR",
id: "OP"
},
{
name: "LMNO",
id: "LM"
},
{
name: "KLM",
id: "KL"
}
];
How to create like above json and store in $scope variable so I can access it using name and id separately.
Please help me...!!
I am giving by my own now cause I got it little bit late.
Solution is I have pushed the data wrong I have solved it like:
$scope.states.push({
name: "string",
id: int,
});
and I got it.
Handsontable really fits my needs when it comes to UI interaction. But was wondering if it can also pivot data.
I have Json data that looks like this:
var objectData = [
{id: 1, name: "Ted Right", gender: "male"},
{id: 2, name: "Bill Allan", gender: "male"},
{id: 1, name: "Joan Well", gender: "female"},
{id: 2, name: "Jane Doe", gender: "female"}
];
where id value should be the row name and the gender value should be the column header and the name is the value in the table.
I'm not sure it's possible natively within the framework, but it looks like you can dynamically pass an array containing the column definitions to the table instance while creating it, so you could potentially handle it that way in javascript - you might want to check out this example.
How to create dynamic columns for Handsontable?
Old thread I know, but it's the first one that comes up for handsontable pivot table, so hopefully this helps someone.
To set custom row/column headers, have a look here:
http://handsontable.com/demo/renderers_html.html#header
Portion from above page:
$container.handsontable({
colHeaders: [
"<b>Bold</b> and <em>Beautiful</em>",
"Some <input type='checkbox' class='checker'> checkbox"
]
})