I have created a tree panel by specifying the xtype as treecolumn. I want to select the first leaf of the tree. In this example I have registered the boxready event detailed below:
boxready : function( treePanel, width, height, eOpts ){
treePanel.getSelectionModel().select( 0 );
//treePanel.select( treePanel.getRootNode().getChildAt(0) );
treePanel.getSelectionModel().selected = 0;
},
treePanel.getSelectionModel()
This example is giving me selectionmodel of type SINGLE. Can anyone explain why my example does not select the first leaf?
This is a little "diagram":
If you need the leaf from beginning with:
one node selected:
var nodeData = treePanel.getSelectionModel().getSelection();
from the begin:
var node = treePanel.getRootNode(); -- father ( first Node );
findLeaf : function(node){
if(node.isLeaf()){
// this is the node that u want
}else{
// bucle to find it
node.eachChild(function(nodeChild,array){
if(nodeChild.isLeaf()){
// this is the node that u want
}else{
// get childs of this node
if(nodeChild.hasChildNodes()){
//find the childs from this node.
this.findLeaf(nodeChild);
}
}
});
}
};
Related
I have several tabs with same page elements. One of the element contains a map div based on location details. I could get the map initialized for the first tab opened. The next tab when I open it throws up error as the div id containing the map is already initialized. How to make the div id unique (dynamic) for each map initialization in different tabs? Any idea would help me!
You can use this function to generate a completely unique id which you can then set with [id]="getUniqueId()":
getUniqueID(): string {
let d = Date.now();
if (window.performance && typeof window.performance.now === 'function') {
d += performance.now();
}
const id = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
const r = (d + Math.random() * 16) % 16 | 0;
d = Math.floor(d/16);
return (c === 'x' ? r : (r&0x3|0x8)).toString(16);
});
return id;
}
I'm trying to dynamically place different metabolic pathways (nodes following a preset layout contained in a parent node).
Normally i would define positions for each child node, so as to not overlap the parent nodes. However the graphs( = generated json containing the requested nodes) are generated dynamically, so this is not an option.
Is there a way to achieve this, short of recalculating positions for each node as the json is being generated.
E.g.: requesting glycolysis -> TCA -> Urea
Current situation
Acceptable solution
If you want to do something manual like that you'll probably have to use some code rather than just specify a layout.
let shiftPosition = (pos, delta) => ({ x: pos.x + delta.x, y: pos.y + delta.y });
let shiftNode = (node, delta) => shiftPosition( node.position(), delta );
let findDelta = parent => ({ x: 100, y: 100 }); // determine yourself
cy.nodes(':parent').forEach( parent => {
let delta = findDelta( parent );
parent.children().positions( node => shiftNode( node, delta ) );
} );
So I want to allow the user to conditionally turn columns on/off in a Cardboard app I built. I have two problems.
I tried using the 'columns' attribute in the config but I can't seem to find a default value for it that would allow ALL columns to display(All check boxes checked) based on the attribute, ie. the default behavior if I don't include 'columns' in the config object at all (tried null, [] but that displays NO columns).
So that gets to my second problem, if there is no default value is there a simple way to only change that value in the config object or do I have to encapsulate the entire variable in 'if-else' statements?
Finally if I have to manually build the string I need to parse the values of an existing custom attribute (a drop list) we have on the portfolio object. I can't seem to get the rally.forEach loop syntax right. Does someone have a simple example?
Thanks
Dax - Autodesk
I found a example in the online SDK from Rally that I could modify to answer the second part (This assumes a custom attribute on Portfolio item called "ADSK Kanban State" and will output values to console) :
var showAttributeValues = function(results) {
for (var property in results) {
for (var i=0 ; i < results[property].length ; i++) {
console.log("Attribute Value : " + results[property][i]);
}
}
};
var queryConfig = [];
queryConfig[0] = {
type: 'Portfolio Item',
key : 'eKanbanState',
attribute: 'ADSK Kanban State'
};
rallyDataSource.findAll(queryConfig, showAttributeValues);
rally.forEach loops over each key in the first argument and will execute the function passed as the second argument each time.
It will work with either objects or arrays.
For an array:
var array = [1];
rally.forEach(array, function(value, i) {
//value = 1
//i = 0
});
For an object:
var obj = {
foo: 'bar'
};
rally.forEach(obj, function(value, key) {
//value = 'bar'
//key = 'foo'
});
I think that the code to dynamically build a config using the "results" collection created by your query above and passed to your sample showAttributeValues callback, is going to look a lot like the example of dynamically building a set of Table columns as shown in:
Rally App SDK: Is there a way to have variable columns for table?
I'm envisioning something like the following:
// Dynamically build column config array for cardboard config
var columnsArray = new Array();
for (var property in results) {
for (var i=0 ; i < results[property].length ; i++) {
columnsArray.push("'" + results[property][i] + "'");
}
}
var cardboardConfig = {
{
attribute: 'eKanbanState',
columns: columnsArray,
// .. rest of config here
}
// .. (re)-construct cardboard...
Sounds like you're building a neat board. You'll have to provide the board with the list of columns to show each time (destroying the old board and creating a new one).
Example config:
{
attribute: 'ScheduleState'
columns: [
'In-Progress',
'Completed'
]
}
I am currently working with mono and gtk#.
Regarding the TreeView there is this Tutorial.
I want to achieve the same thing thats presented under "Controlling how the model is used"
So i have the Song Class and the Render-Methods to display artist and title.
But I want to display it via a TreeStore instead of a ListStore. So that I have a Rootnode for each Letter and under this node all Artists starting with this letter should be displayed.
My problem how can I add these RootNodes to the TreeStore? And where should I add them?
songs.Add(new Song("Dancing Djs vs. Roxette", "Fading like a flower"));
songs.Add(new Song("Xaiver","give me the right"));
songs.Add(new Song("Daft Punkt","Technologic"));
TreeStore musicListStore = new TreeStore(typeof(Song));
foreach (var s in songs)
{
musicListStore.AppendValues(s);
}
treeview1.Model = musicListStore;
treeview1.AppendColumn("Artist", new CellRendererText(),new TreeCellDataFunc(RenderArtistName));
treeview1.AppendColumn("Title", new CellRendererText(),new TreeCellDataFunc(RenderSongTitle));
private void RenderArtistName(TreeViewColumn column, CellRenderer cell, TreeModel model, TreeIter iter)
{
Song s = model.GetValue(iter,0) as Song;
(cell as CellRendererText).Text = s.Artist;
}
private void RenderSongTitle(TreeViewColumn column, CellRenderer cell, TreeModel model, TreeIter iter)
{
Song s = model.GetValue(iter,0) as Song;
(cell as CellRendererText).Text = s.Title;
}
So i want to achieve that there are RootNodes for each letter and underneath each letter there should be all Artists listed starting with this letter.
My problem is how to add the letter to the TreeStore plus how do i know where to insert each Song then.
Here is a screenshot how i would like it to look like(I am not allowed to upload them directly. So i Had to use an external hosted. Sry):
Screenshot
You can build up your tree quite easily. Eg;
var store = new Gtk.TreeStore( typeof(string) );
// add a root node
var root = store.AppendValues("hello");
// add a child of the root
store.AppendValues(root,"world");
// add another child
var mono = store.AppendValues(root,"mono");
// add a second level child
store.AppendValues(mono,"gtk");
So, in the context of your music app..
// title, artist
var store = new Gtk.TreeStore( typeof(string), typeof(string) );
// make an index of top level nodes using thier TreeIters
var index = new Dictionary<string,Gtk.TreeIter>();
// add index nodes
foreach ( var letter in new List<string>{ "A", "B", "C" ... "Z" } ){
index[letter.ToLower()] = store.AppendValues( letter );
}
// add songs
foreach ( var song in songlist ){
var title = song.Title;
var artist = song.Artist;
var first = title.SubString(0,1).ToLower();
var iter = store[first];
// add this song
store.AppendValues( iter, title, artist );
}
You will have to do some extra work if you want to dynamically add index nodes, each time you add a node at a level all your treeiter values at that level or deeper become worthless.
I have a dijit.form.NumberTextBox input field that starts out with these parms:
new dijit.form.NumberTextBox({
id: din1,
style: "width:60px",
constraints: {
places: 0,
pattern: '######'
}
},
din1);
Everything works great..My question is I would like to change 'places' and 'pattern' parms on the fly. So I wrote this to change 'places' and 'patterns' parms:
var myFldObj = dijit.byId(din1);
if (myFldObj) {
var myConstObj = myFldObj.attr('constraints');
if (myConstObj) {
myConstObj.places = 2;
myConstObj.pattern = '#####.0';
}
}
So, after I show the form again, I'd expect the entry field to allow 2 decimal places but the form still acts like places=0 and pattern='######'. When I check the values of 'places' and 'pattern' I get what I'd expect (2 and #####.0). My question:
Can you change these values on the fly??
OR
Do you have to destroy the original dijit object and recreate with new parms??
Thx!!
So, here is what worked for me:
First, I think this is a bug because an input field that starts out like
new dijit.form.NumberTextBox({
id: "fieldID",
style: "width:60px",
constraints: {
places: 0
}
},
"fieldID");
that is then changed on the fly with code like:
NOTE: ntbArry - Array of dijit.form.NumberTextBox objs tied to a html
input tag id.
for (var x=0;x < ntbArry.length;x++) {
var handle = ntbArry[x];
if (handle) {
handle.attr('constraints').places = 2;
handle.attr('constraints').pattern = '#####.0#';
}
}
Does not exhibit the same behavior as a field created this way (no constraints mods on the fly):
new dijit.form.NumberTextBox({
id: "fieldID",
style: "width: 60px",
constraints: {
places: 2,
pattern: '#####.0#'
}
},
"fieldID");
It's close in behavior but every time you type a decimal point, the error message pops up stating invalid entry. This message doesn't pop up when typing the decimal point on a field that was originally created with the constraints places=2 and pattern '#####.0#'.
So, to get original behavior I wanted:
fieldIDEvents is an array of dojo events tied to NumberTextBox fields.
Before continuing disconnect dojo events
for (var x=0;x < fieldIDEvents.length;x++) {
var handle = fieldIDEvents[x];
if (handle) {
dojo.disconnect(handle);
}
}
then destroy the NumberTextBox dojo objects
for (var x=0;x < ntbArry.length;x++) {
var handle = ntbArry[x];
if (handle) {
handle.destroy();
ntbArry[x] = null;
}
}
Next, place the input tag back into the html because it gets destroyed:
NOTE: tdtag and an id on a html td tag which should contain the input tag.
var fld1 = this.document.getElementById("tdtag");
if (fld1) {
//alert("\""+fld1.innerHTML+"\"");
fld1.innerHTML = "<input id=\"fieldID\">";
}
Now, create the NumberTextBox object again:
ntbArry[0] = new dijit.form.NumberTextBox({
id: "fieldID",
style: "width: 60px",
constraints: {
places: 2,
pattern: '#####.0#'
}
},
"fieldID");
It's a few extra steps but, at least I know this is what works for me..If I'm missing something basic, let me know, it's easy to miss the small details with this stuff.
I use Dojo 1.3 and I can see that dijit.form.NumberTextBox has no pattern and places properties, but has editOptions property. So I would try to change the constraints like this:
myConstObj.editOption.places = 2;