5

I am building a pluggable node-graph widget and retrieving node entities over a datasource. I’m able to read the values but the readonly attribute of the “ListAttributeValue” is always true. In this case the X/Y attributes. How can I change data in my ListValue as I’m unable to find sufficient documentation for this? Also I with pluggable widgets,  I don’t have the path to the attribute so I can’t use the classical way of changing data using mx.data. import { Component, ReactNode, createElement, MouseEvent } from "react"; import ReactFlow, { Node } from "react-flow-renderer"; import { ListAttributeValue, ListValue } from "mendix"; export interface HelloWorldSampleProps { nodeEntities: ListValue; nodeX: ListAttributeValue<BigJs.Big>; nodeY: ListAttributeValue<BigJs.Big>; nodeId: ListAttributeValue<string>; nodeLabel: ListAttributeValue<string>; } declare const mx: any; export class HelloWorldSample extends Component<HelloWorldSampleProps> { render(): ReactNode { const elements: any[] = this.props?.nodeEntities?.items?.map((node: any) => { const x = this.props.nodeX(node); const y = this.props.nodeY(node); const id = this.props.nodeId(node); const label = this.props.nodeLabel(node); return { id: id.value, data: { label: label.value, node }, position: { x: x.value, y: y.value } }; }) || []; return ( <div style={{ height: 500, width: 800 }}> <ReactFlow elements={elements} onNodeDragStop={(event: MouseEvent, node: Node) => { console.log("event", event); console.log("node", node); const x = this.props.nodeX(node.data.node); // Tried setting the object the old fashioned way, but I don't have the path to the attribute :( // const mxObj = mx.data.getCachedObject(node.id); // mxObj.set(x.Arrrrrrggggg!, node.data.x) }} /> </div> ); } }   <propertyGroup caption="General"> <property key="nodeEntities" type="datasource" required="true" isList="true"> <caption>Node Entity</caption> <description>Entity for the Node that is displayed in the widget.</description> </property> <property key="nodeX" type="attribute" dataSource="nodeEntities"> <caption>nodeX</caption> <description>nodeX</description> <attributeTypes> <attributeType name="Integer"/> </attributeTypes> </property> <property key="nodeY" type="attribute" dataSource="nodeEntities"> <caption>nodeY</caption> <description>nodeY</description> <attributeTypes> <attributeType name="Integer"/> </attributeTypes> </property> <property key="nodeId" type="attribute" dataSource="nodeEntities"> <caption>nodeId</caption> <description>nodeId</description> <attributeTypes> <attributeType name="String"/> </attributeTypes> </property> <property key="nodeLabel" type="attribute" dataSource="nodeEntities"> <caption>nodeLabel</caption> <description>nodeLabel</description> <attributeTypes> <attributeType name="String"/> </attributeTypes> </property> </propertyGroup> <propertyGroup caption="Editability"> <systemProperty key="Editability"/> </propertyGroup>  

asked 2020-09-10

0 answers