Count total rows excluding children rows - ag-grid

I have a requirement for display only row count of parent rows in tree data mode. I am using getDisplayedRowCount api it gives me all the row count i.e parent + child (if expanded). Is there any way to do it?
For example
If we have rows like below where 2 row has child and 1 row has no child then just count as 3 . dont count children. Just count parent row and row without children
Result count : 3 of 3
Parent row 1
--- Child row
Parent row 2
--- child row
Row without child
For example, if we have tree structure like in the example . How to only count A, C and E? and show count as 3 on top of grid
https://www.ag-grid.com/example-runner/grid-react.php?section=javascript-grid-tree-data&example=filler-nodes&generated=1&clientside=1&rowgrouping=1&enterprise=1&grid=%7B%22noStyle%22%3A0%2C%22height%22%3A%22100%25%22%2C%22width%22%3A%22100%25%22%2C%22enterprise%22%3Atrue%7D
https://www.ag-grid.com/javascript-grid-tree-data/

One possible solution would be to rely on the fact that the parent node of the nodes A, C & E (in your given example) is the root node - note that this is not documented in the official documentation, however it is the simplest solution I can think of.
If a node has the root node as the parent, then we can call it a parent node.
You can verify this by adding this code and look at the nodes which are printed:
gridOptions.api.forEachNode((node) => {
if (node.parent.id == 'ROOT_NODE_ID') {
console.log(node.key);
}
});
I've put together an example showing this at the click of a button

Related

How to avoid moving child object when parent is moved?

Is it possible to avoid moving inline child objects of parent when parent record is moved?
My use case:
There is TYPO3 record (parent) of type X which has inline relation to record of type Y (child).
Following configuration is loaded:
TCAdefaults.Y {
pid = 129
}
I am adding new X record on page 1 and inline relation of type Y. X
is created with pid = 1 and Y is created with pid = 129. So far
good.
Now I am moving record X to page 2. Both X and Y have pid 2 now. How can
I avoid that? I don't want inline record Y to change pid when X is moved in backend (example cut and paste functionality).
There is a TCA configuration for this purpose. Add this to your TCA inline field configuration:
'behavior' => [
'disableMovingChildrenWithParent' => true
],
The docs: https://docs.typo3.org/typo3cms/TCAReference/ColumnsConfig/Type/Inline.html#disablemovingchildrenwithparent

Split the lines of record in crystal report?

I have below data in my report footer b section.
Container No
12344, ABC12341234, BNMKLO00, CAIU86284560, CAIU8628757,
DEF34190000, DES23457, DF3134, DF347900, DFRT56990,
DSE234661, FGR450000, GHM890000, KLM1230992, KLO900123,
PLO67799, QSAW12345, QWE123456, RT56000, RT560012WE,
SAW12344, SDQ123456789, TYHYH667000, TYT5612334,
VBGT6787900, VFR3400001, WHLU1234, WHLU5420938,
WHLU5581193, WQR6790000, XCDER40000
This containerNo list display in one field as well as I do in sql statement.
I want to display the maximum line of records as long as it was fit until to bottom of page, then the remainder line of records will be continue on the next page.
So, the output should be like:
--Page 1 of 2
Container No
12344, ABC12341234, BNMKLO00, CAIU86284560, CAIU8628757,
DEF34190000, DES23457, DF3134, DF347900, DFRT56990,
DSE234661, FGR450000, GHM890000, KLM1230992, KLO900123,
PLO67799, QSAW12345, QWE123456, RT56000, RT560012WE,
SAW12344, SDQ123456789, TYHYH667000, TYT5612334,
--Page 2 of 2
Container No
VBGT6787900, VFR3400001, WHLU1234, WHLU5420938,
WHLU5581193, WQR6790000, XCDER40000
How can I do that without using a sub-report and group?

jquery ui sortable temporary element swapping during drag

I need to implement temporary drag replacement in a size-limited jquery ui sortable list.
I have 2 sortable lists:
A "slot" with only 1 spot to hold a single element
A "bucket" that holds several elements from which the user can pick any to fill the "slot"
The user has to drag an element from the bucket into the slot. While the user is holding the element with the mouse over the slot, if the slot is already occupied, the current slotted element should be moved into the bucket to visually make room for the dragged element. Then the user has 2 options:
If the user drops the new element: insert the new element into the slot
If the user cancels the drop: move the previously slotted element back into the slot (as it was originally)
This behaviour should repeat until the user has either cancelled the drag or dropped the element into the slot or the bucket.
To visually limit the slot to a single element, I have limited it to the exact height of a single element and setted its overflow to hidden.
Unfortunately, I have not been able to produce the effect while keeping a single element in the slot at all time.
EDIT 1: Here is an example of what I have so far
$(".slot").bind("sortchange", function (event, ui) {
var slot = $(event.target);
var bucket = $(".bucket");
// Move any element already in the slot (other than the currently
// dragged element) into the bucket
var slotElements = slot.children(".item").not(ui.item);
if (slotElements.length > 0) {
for (var idx = 0; idx < slotElements.length; idx += 1) {
var element = $(slotElements[idx]);
moveAnimate(element, bucket);
}
}
});

FormLayout, FormData and controls

can someone please explain to me how FormData on FormLayout works? I'm trying to understand the FormAttachment constructors and its parameters (numerator, offset, denominator). When do you need only one of them, two of them or all of the parameters... Also, if i have a group (or a composite) which will add widgets like buttons and labels which will need to be resized as per resolution using FormData, does the Group need to have a FormLayout also? I tried specifying a width of a group with form layout but no change
FormAttachment has several different constructors, I generally use two typically:
new FormAttachment (int numerator, int offset) - If there's only two integer parameters then the first parameter represents the percentage from the edge of the parent. Which edge is determined by which slot in the FormData object you insert the FormAttachment into: FormData.top, data.bottom, data.left, and FormData.right.
new FormAttachment (Control control, int offset) - Instead of positioning the object against the parent, this positions the object next to another child object. This works in conjunction with the previous constructor so that you effectively "anchor" one element against the parent, then build your layout by positioning other elements relative to the anchor. This also allows you to easily move and insert elements into the overall layout without having to rebuild the entire layout.
The others are variations on the themes of these two. FormAttachment (int numerator, int denominator, int offset) is the same as the FormAttachment with two integer parameters, but with two the denominator just becomes "100", i.e. it turns the numerator into a percentage. But you could say something like (1, 2, 0) for 1/2 of the way across or (1, 3, 0) for 1/3 of the space.
I'm not sure what you mean about whether the Group will need to have a layout defined but in general every parent Composite must have a layout defined on it to display children elements. If you want elements to resize as the parent resizes, one option is to attach the child to both the left and right sides of the element:
FormData formData = new FormData();
formData.left = new FormAttachment (0, 0); // Attach at the 0% left with 0 offset
formData.right = new FormAttachment (100, 0); // Attach at the 100% right with 0 offset
The Eclipse site has a lot of good snippets showing FormLayout, check out:
http://www.eclipse.org/swt/snippets/
Scroll down to the FormLayout section.

how to get the drop target from gwt-dnd

I have a vertical panel containing two rows, say row 1 and row 2, each
row contains couple of widgets, now i need to allow the user to drag
and drop widgets between row 1 and row 2, here is what i did
_handler = new DragHandler() { .... };
_widgetDragController = new PickupDragController(boundaryPanel, false);
_widgetDragController.setBehaviorMultipleSelection(false);
_widgetDragController.addDragHandler(_handler);
then for each row, create panel to hold widgets and assign a drop controller:
VerticalPanelWithSpacer vPanel = new VerticalPanelWithSpacer();
// initialize a widget drop controller for the current column VerticalPanelDropController
widgetDropController = new VerticalPanelDropController(vPanel);
_widgetDragController.registerDropController(widgetDropController);
how can i find the drop target (namely which row) when i dnd widgets between row 1 and row 2? is there any way the _widgetDragController can tell which drop controller got involved and then i can further call getDropTarget() from the drop controller?
You could implement the functionality in VerticalPanelDropController.onDrop(DragContext), which gets called when the users drop on that drop controller. The drop controller knows the VerticalPanelWithSpacer it belongs to, and the dragContext contains information such as the x, y coordinates. You could use this information (the y coordinate & the coordinates of the widget) to calculate the row which should be added (although you might need to take scrolling etc into account, which makes it a bit more tricky). Hope that helps :-)