ExtJS Tree same parentNode - ajax

I am rendering a Tree using Jason array that i get from a jsp page. So the tree has root node and 3 nodes and each node has more than 5 children and some of the children has same id and same text. It renders properly and no issues in display.
I am trying to make the user select child nodes of only one type (one of 3 nodes). if the user selects any node which is not the sibling of already existing node then i just need to un check already checked nodes. This sounds pretty simple and i coded it. I basically compared the parent nodes(node.parentNode.id) of the checked node with the already checked nodes(tree.getCheckedNodes())
the problem is when i select children nodes which have same id and text my logic fails and they say that they have same parentNode.id even though they have different parentNode.id. Does the tree panel check for duplicate elements and assign them to same parentnode while loading? what is going here and how to fix this any ideas. thank you.
Ext.onReady(function(){
var tree = new Ext.tree.TreePanel({
id: 'deficiencyTree',
renderTo: 'MyTable',
title: 'Deficiencies',
height: 'auto',
width: 525,
useArrows: true,
autoScroll: true,
animate: true,
enableDD: true,
containerScroll: true,
rootVisible: false,
frame: false,
root:{nodeType: 'async'},
dataUrl: 'jsonFile.jsp',
listeners: {
'checkchange': function (node, checked) {
if (checked) {
selNodes = tree.getChecked();
alert(selNodes);
Ext.each(selNodes, function (nodes) {
alert("id values for node and nodes "+node.parentNode.id+" "+nodes.parentNode.id);
if (nodes.parentNode.id != node.parentNode.id)
{
nodes.getUI().toggleCheck();
}
});
}
list.length = 0;
iii = 0;
selNodess = tree.getChecked();
Ext.each(selNodess, function (nodes) {
list[iii] = nodes.id;
iii++;
});
}
}
});
tree.getRootNode().expand(false);
});

As a semi-aside, ideally you should not be replicating node IDs at all (an ID should never be replicated, otherwise it isnt an ID). If you need the value that you are currently assigning to the ID field, add an additional attribute to the node and place it here- you can refer to this attribute when you need to. ExtJS isnt built to handle duplicate IDs for notes within the same tree very well at all.

I used hierarhical ids to solve this problem:
so if path to element was x->y->z then his id in tree will be x+y+z
you just need to change server-side code:
- Get id in format x+y+z, find last + and get z
- Return elements with ids [x+y+z+childId]

Good news. I got it working. it was pretty simple. As "Xupypr MV" suggested, i shouldn't be using same ID which is against the basic functionality, so i did put a different id for each node and put a new attribute named id2 and assigned it the value i needed and then accessed it using node.attribute["id2"], and it work perfectly well. previously i tried to get the attribute value as node.id2 just like node.id, node.text which did not work. Thanks again for the responses.

Related

Creating unique structures in Neo4j with them having nodes that are part of another structure

Let's say that we have n nodes with label :Test and a unique property called type.
UNWIND[{ type:"a" }, { type:"b" }, { type:"c" }, { type:"d" }] AS x
MERGE (t:Test { type: x.type })
RETURN t
That looks like this
Now let's introduce a node of label :Collection. The purpose if this node is to have a unique relationship pattern with the :Test nodes.
MATCH (a:Test { type:"a" }),(b:Test { type:"b" })
CREATE UNIQUE (x:Collection)-[:HAS]->(a),(x:Collection)-[:HAS]->(b)
Return *
The problem that I face starts occurring when I try to make another unique structure, like the previous one, but with some nodes in common.
MATCH (a:Test { type:"a" })
CREATE UNIQUE (x:Collection)-[:HAS]->(a)
RETURN *
The expected result is that another node of label :Collection gets created and linked to :Test {type:"a"} but the actual result is that it matches the previous data structure and returns that instead of creating a new one.
The expected result should have 2 :Collection nodes, one linked to type:"a", the other one linked to type:"a" and type:"b".
Any input kind of input will be very appreciated :D
From the neo4j docs on CREATE UNIQUE:
CREATE UNIQUE is in the middle of MATCH and CREATE — it will match
what it can, and create what is missing. CREATE UNIQUE will always
make the least change possible to the graph — if it can use parts of
the existing graph, it will.
You add Collection nodes without any properties. I think if CREATE UNIQUE finds a Collection node, it will use it. This is how CREATE UNIQUE is supposed to work.
So if you want a new Collection that is linked to some Test nodes, you can either add some unique properties to the node:
MATCH (a:Test { type:"a" })
CREATE UNIQUE (x:Collection {key: 'unique value'})-[:HAS]->(a)
RETURN *
Or create it in a separate step:
MATCH (a:Test { type:"a" })
CREATE (x:Collection)
CREATE (x)-[:HAS]->(a)
RETURN *
Or use MERGE instead of CREATE UNIQUE.

Is it possible to filter the descendant elements returned from an XPath query?

At the moment, I'm trying to scrape forms from some sites using the following query:
select * from html
where url="http://somedomain.com"
and xpath="//form[#action]"
This returns a result like so:
{
form: {
action: "/some/submit",
id: "someId",
div: {
input: [
... some input elements here
]
}
fieldset: {
div: {
input: [
... some more input elements here
]
}
}
}
}
On some sites this could go many levels deep, so I'm not sure how to begin trying to filter out the unwanted elements in the result. If I could filter them out here, then it would make my back-end code much simpler. Basically, I'd just like the form and any label, input, select (and option) and textarea descendants.
Here's an XPath query I tried, but I realised that the element hierarchy would not be maintained and this might cause a problem if there are multiple forms on the page:
//form[#action]/descendant-or-self::*[self::form or self::input or self::select or self::textarea or self::label]
However, I did notice that the elements returned by this query were no longer returned under divs and other elements beneath the form.
I don't think it will be possible in a plain query as you have tried.
However, it would not be too much work to create a new data table containing some JavaScript that does the filtering you're looking for.
Data table
A quick, little <execute> block might look something like the following.
var elements = y.query("select * from html where url=#u and xpath=#x", {u: url, x: xpath}).results.elements();
var results = <url url={url}></url>;
for each (element in elements) {
var result = element.copy();
result.setChildren("");
result.normalize();
for each (descendant in y.xpath(element, filter)) {
result.node += descendant;
}
results.node += result;
}
response.object = results;
» See the full example data table.
Example query
use "store://VNZVLxovxTLeqYRH6yQQtc" as example;
select * from example where url="http://www.yahoo.com"
» See this query in the YQL console
Example results
Hopefully the above is a step in the right direction, and doesn't look too daunting.
Links
Open Data Tables Reference
Executing JavaScript in Open Data Tables
YQL Editor
This is how I would filter specific nodes but still allow the parent tag with all attributes to show:
//form[#name]/#* | //form[#action]/descendant-or-self::node()[name()='input' or name()='select' or name()='textarea' or name()='label']
If there are multiple form tags on the page, they should be grouped off by this parent tag and not all wedged together and unidentifiable.
You could also reverse the union if it would help how you'd like the nodes to appear:
//form[#action]/descendant-or-self::node()[name()='input' or name()='select' or name()='textarea' or name()='label'] | //form[#name]/#*

idPrefix usage in jqGrid

Given a jqGrid populated with local data and created with the option of idPrefix:"custTable" , all the generated rows get the prefix in the html id i.e. custTableRow_1 custTableRow_2 etc. Does this idPrefix'ed version of the id need to be passed in to the jqGrid methods, if so which ones?
for example to delete a row with deleteRowData does it need the prefixed id? how about setRowData or addRowData? when adding after row x it seems to need the prefixed for the srcrowid parameter. How about multiselect rows?
If I delete a row using the prefixed id of the row it disappears from the display but when I reload the grid the delete item shows up again in the grid, like it wasn't removed. This doesn't happen when idPrefix is not used.
thanks for any help.
The option idPrefix was introduced to hold ids on the HTML page unique even you have on the page the ids like the rowids loaded from the server. Typical example is two grids with the data loaded from the server. Let us you have two tables in the database where you use IDENTITY or AUTOINCREMENT in the definition of the PRIMARY KEY. In the case the primary key will be generated automatically in the table and will be unique inside the table, but there are not unique over the tables. So if you would use the primary keys as ids of the grids and place on one page two grids you can have id duplicates.
To solve the problem you can use idPrefix: "a" as additional option in the first grid and use idPrefix: "b" in the second grid. In the case locally jqGrid will uses everywhere ids with the prefix, but the prefix will be cut if the ids will be sent to the server.
So you will see locally in all callbacks (events) and in all methods (like setRowData, addRowData etc) the ids with the prefix, but on the server side the ids the prefixes will be removed immediately before sending to the server.
I recommend you additionally to read another answer about the restrictions in the ids which I posted today.
UPDATED: I looked through the code which you posed on jsfiddle and found some clear bugs in your code. You current code
1) use wrong algorithm to generate id of the new row. For example the following code
// generic way to create an animal
function newAnimal(collection, defaults) {
var next = collection.length + 1;
var newpet = {
id : next,
name: defaults.name + next,
breed: defaults.breed
};
return newpet;
}
use collection.length + 1 for the new id. It's wrong if you allows to delete the items. By adding of two items, deleting one from there and adding new item one more time follows to id duplicates. Instead of that it's more safe to use some variable which will be only incremented. You can use $.jgrid.randId() for example which code is very simple.
2) you call addRowData with adding a prefix manually (see dogsPrefix+newdog.id below). It's wrong because jqGrid adds the prefix one more time to the rows.
// add dog button actions
$('#dogAddAtEnd').click(function() {
var newdog = newAnimal(dogs, dogDefaults);
dogs.push(newdog);
dogAdded();
dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);
});
Probably there are more problems, but at least these problems can explain the problems which you described.
UPDATED 2: I examined new demo which you posted. It has still the lines
grid.jqGrid('addRowData', newanimal.id, newanimal,
"after", prefix+ followingId);
and
dogsTable.jqGrid('addRowData', dogsPrefix+newdog.id, newdog);
which must be fixed to
grid.jqGrid('addRowData', newanimal.id, newanimal,
"after", followingId);
and
dogsTable.jqGrid('addRowData', newdog.id, newdog);
Nevertheless I tested the demo after the changes and found bugs in code of addRowData, delRowData and setRowData. The problem are in the line of the delRowData and the same line of setRowData
var pos = $t.p._index[rowid];
can be fixed to the following
var id = $.jgrid.stripPref($t.p.idPrefix, rowid), pos = $t.p._index[id];
Inside of addRowData I suggest to include the line
var id = rowid; // pure id without prefix
before the line
rowid = t.p.idPrefix + rowid;
of addRowData. Another tow lines of addRowData
lcdata[t.p.localReader.id] = rowid;
t.p._index[rowid] = t.p.data.length;
should be changed to
lcdata[t.p.localReader.id] = id;
t.p._index[id] = t.p.data.length;
where unprefixed id will be used.
The modified code of you demo which uses the fixed version of jquery.jqGrid.src.js you can test here.
I will post my bug report to trirand later to inform the developer of the jqGrid. I hope that soon the bug fix will be included in the main code of jqGrid.
Additionally I recommend you to use $.jgrid.stripPref method to strip prefixes from the rowids. For example the function
//general delete selected
function deleteSelectedAnimal(list, grid, prefix)
{
var sel = grid.jqGrid('getGridParam', 'selrow');
if (sel.length)
{
var gridrow = sel;
//get the unprefixed model id
var modelid = gridrow;
if (prefix.length !== 0)
{
modelid = modelid.split(prefix)[1];
}
// make it a numeric
modelid = Number(modelid);
//delete the row in the collection
list = RemoveAnimal(list, modelid);
//delete the row in the grid
grid.jqGrid('delRowData', gridrow);
}
}
from your demo can be rewritten to the following
//general delete selected
function deleteSelectedAnimal(list, grid)
{
var sel = grid.jqGrid('getGridParam', 'selrow'),
gridPrefix = grid.jqGrid('getGridParam', 'idPrefix');
if (sel !== null)
{
//delete the row in the collection
// ??? the gogs list will be not modified in the way !!!
list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel));
//delete the row in the grid
grid.jqGrid('delRowData', sel);
}
}
I am not sure that the line list = RemoveAnimal(list, $.jgrid.stripPref(gridPrefix, sel)); or the function RemoveAnimal do what you want, but it's not a problem which connected with jqGrid.
One more small remark about your code. You use already in the objects which you add to the grid the id property. It's the same name as defined in the localReader.id. In the case the data from the id property will be used as id attribute of the grid rows (<tr>). The local data parameter will save the id additionally to other properties which are build from the name property of the items of colModel. So I see no sense to define hidden column
{ key: true, name: 'id', align: 'left', hidden: true }
How you can see on the demo all stay works exactly as before if you remove id column from the grids which you use.
UPDATED 3: As promised before I posted the corresponding bug report here.

Model records ordering in Spine.js

As I can see in the Spine.js sources the Model.each() function returns Model's records in the order of their IDs. This is completely unreliable in scenarios where ordering is important: long person list etc.
Can you suggest a way to keep original records ordering (in the same order as they've arrived via refresh() or similar functions) ?
P.S.
Things are even worse because by default Spine.js internally uses new GUIDs as IDs. So records order is completely random which unacceptable.
EDIT:
Seems that in last commit https://github.com/maccman/spine/commit/116b722dd8ea9912b9906db6b70da7948c16948a
they made it possible, but I have not tested it myself because I switched from Spine to Knockout.
Bumped into the same problem learning spine.js. I'm using pure JS, so i was neglecting the the contact example http://spinejs.com/docs/example_contacts which helped out on this one. As a matter of fact, you can't really keep the ordering from the server this way, but you can do your own ordering with javascript.
Notice that i'm using the Element Pattern here. (http://spinejs.com/docs/controller_patterns)
First you set the function which is gonna do the sorting inside the model:
/*Extending the Student Model*/
Student.extend({
nameSort: function(a,b) {
if ((a.name || a.email) > (b.name || b.email))
return 1;
else
return -1
}
});
Then, in the students controller you set the elements using the sort:
/*Controller that manages the students*/
var Students = Spine.Controller.sub({
/*code ommited for simplicity*/
addOne: function(student){
var item = new StudentItem({item: student});
this.append(item.render());
},
addAll: function(){
var sortedByName = Student.all().sort(Student.nameSort);
var _self = this;
$.each(sortedByName, function(){_self.addOne(this)});
},
});
And that's it.

Flyweight VirtualRepeater containing IntegerPicker

In my Enyo app, I have a VirtualRepeater which produces Controls containing various text displays and an IntegerPicker.
I have two problems with this repeater:
1) If three rows are produced, clicking on the IntegerPicker in rows 1 and 2 brings up the drop-down picker UI over the top of the IntegerPicker in row 0.
2) I initialise each IntegerPicker with a max value using setMax(). However, if three rows are produced, the IntegerPickers in rows 0 and 1 will have the same max value as that in row 2.
It looks as if only one IntegerPicker is being created and is being used on the first row.
I tried replacing my VirtualRepeater with a Repeater, and changed my repeater row creation function to return a new instance of the item containing the IntegerPicker, instead of returning true. However this produces the error:
warning: enyo.Component.addComponent(): Duplicate component name "itemName" violates unique-name-under-owner rule, replacing existing component in the hash and continuing, but this is an error condition and should be fixed.
It seems that Repeaters need their delegates created inline, which seems quite inelegant.
This code sample illustrates the problem:
enyo.kind({
name:"Test",
kind:enyo.Control,
components: [
{
kind: "VirtualRepeater",
onSetupRow: "setupRow",
components: [{
name: "theIP", kind: "IntegerPicker", min:0
}]
}
],
setupRow: function(inSender, inIndex) {
if (inIndex < 3) {
this.$.theIP.setMax(inIndex);
return true;
}
return false;
}
});
How can I create an arbitrary number of IntegerPickers in my app? Any help appreciated!
What you are doing with theIP in your setupRow function is accessing a specific IntegerPicker itself, which is a child component of the Virtual Repeater. To set the max value of a given IntegerPicker corresponding to the row, give your VirtualRepeater a name attribute, like "PickerList":
kind: "VirtualRepeater",
onSetupRow: "setupRow",
name: "PickerList",
components:[//this should be empty to begin with]
Then you can access each row in the repeater like this:
setupRow: function(inSender, pickerMax) {
var newPicker = new IntegerPicker(pickerMax);
this.$.PickerList.push(newPicker);
To get a specific row in the VirtualRepeater you need to do it like this:
this.$.PickerList[1];
Here is an extended Enyo tutorial which makes use of the VirtualRepeater:
https://developer.palm.com/content/resources/develop/extended_enyo_tutorial.html

Resources