Hi Pete,
Seems I'm a bit too late to avoid you suffering from a programming burn-out
But here is how I try to add new properties to my contributions. Don't know if it is a correct design, but it seemed to be working fine ...
-
A new input field is added to an existing node:
<div class="form-row"> <label for="node-input-newProperty"><i class="icon-tag"></i> newProperty</label> <input type="text" id="node-input-newProperty" placeholder="newProperty"> </div>
-
To make sure it is stored (and communicated to the server-side), I add a newProperty with a default value 123 and a number validator:
defaults: { newProperty: { value:123, validate:RED.validators.number() }, ... }
Then you will see that the validator has run, but the default value hasn't been applied (red triangle):
-
To get rid of the red triangle, you can apply a custom number validator:
defaults: { newProperty: { value:123, validate: function(v) { return !v || !isNaN(v) } }, ... }
This validator returns 'valid' if the newProperty doesn't exist ( see
!v
). Indeed when I add a 'debugger' statement to the validator, you can see clearly that the newProperty doesn't exist: -
Another issue at this moment is that ( at the server-side ) the property also doesn't exist yet:
To solve that, I for a new property I always add the same default value here:
function BlocklyNode(n) { RED.nodes.createNode(this,n); this.newProperty = n.newProperty || 123; ...
Remark: this all happens when the user hasn't opened the config screen of the existing nodes in his flow.
-
As soon as the user opens the config screen of the node, you will see in the oneditprepare that the newProperty doesn't exist here yet (for existing nodes in your flow):
As a result the default value 123 will not be displayed on your screen:
I solve this by setting the default value again in the oneditprepare:
oneditprepare: function() { $('#node-input-newProperty').val(this.newProperty || 123); ...
Now the default value appears on the config screen:
Note that this problem only occurs for existing nodes in your flow. When you drag a new node to your flow, this default value 123 will already be available (so therefore I use
|| 123
).
Hopefully this explains some things to you, and hopefully I didn't make things explode in your brain
Bart