# Lately adding properties on configuration node

**URL:** <https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025>\
**Category:** Developing Nodes\
**Created:** [22 October 2019 16:44 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025 "2019-10-22T16:44:30Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![francxk](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@francxk](https://discourse.nodered.org/u/francxk)\
**Post date:** [22 October 2019 16:44 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/1 "2019-10-22T16:44:30Z")

</div>

I add latetally (after a httpadmin request) properties on a configuration node. everything is saved on the server part (flow files), but when i m editing again the node configuration, the previous settings are not set.

i use the `oneditprepare` to add new item to the data-template-name **panel**

```javascript
               oneditprepare: function() {
                    var formRows = $("div.form-row");
                    if (ofogtype.varList && ofogtype.varList.export) {
                        $.each(ofogtype.varList.export, function(i, item) {
                            // put in GUI
                            var formRow=$('<div>').addClass("form-row")
                                .append(
                                    $('<label/>').attr("for", 'node-config-input-'+item.k).text(item.k)
                                        .prepend($('<i/>').addClass("icon-tag")),
                                    $('<input/>',{type:"text"}).attr('id', 'node-config-input-'+item.k)
                                        .attr('placeholder', item.k)
                                        //.add('placeHoler', item.k)
                                );
                                formRows.after(formRow);
                        });
                    } 
                }

```

The generated HTML looks like if i write HTML. But....

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [22 October 2019 17:20 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/2 "2019-10-22T17:20:10Z")

</div>

> [@francxk](#):
>
> But....

But what?

What have you got in your node's `defaults` object?

What is `ofogtype.varList` ? Where does that come from and how does it relate to the properties you have defined in the `defaults` object?

---

<div class="post-metadata">

**Author:** ![francxk](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@francxk](https://discourse.nodered.org/u/francxk)\
**Post date:** [23 October 2019 06:59 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/3 "2019-10-23T06:59:17Z")

</div>

the `but` ==\> but when i m editing again the node configuration, the previous settings are not set.

for `ofogtype.varList`

```auto
        varList: {
            export :[ 
                {k: "Logger_EndPoint", v: "{{ hostname }}/endpoint/v1/"},
                {k: "var2", v: "ver2 default"},
            ] 
        }
}

```

For `default` object, dynamically created:

```auto
            var defaultsSettings= {
                    instanceName: {value:"Logger"}
            };
            // Get export Var
            if (ofogtype.varList && ofogtype.varList.export) {
                $.each(ofogtype.varList.export, function(i, item) {
                    defaultsSettings[item.k]= { value: item.v };
                }); 
            };

            RED.nodes.registerType(localNodeType,{
                category: 'config',
                color: '#a6bbcf',
                defaults: defaultsSettings,
....

```

There's something wrong with the `DOM`

I add a class to the DOM element:

```auto
                oneditprepare: function() {
                    var formRows = $("div.form-row");
                    console.log("----------------------");
                    console.log(this);
                    if ( ofogtype.varList && ofogtype.varList.export) {
                        console.log("----------------prepare gui-----");
                        guiWidgetPrepared=true;
                        $.each(ofogtype.varList.export, function(i, item) {
                            // put in GUI
                            var formRow=$('<div>').addClass("form-row").addClass("test-franck")
                                .append(
                                    $('<label/>').attr("for", 'node-config-input-'+item.k).text(item.k)
                                        .prepend($('<i/>').addClass("icon-tag")),
                                    $('<input/>',{type:"text"}).attr('id', 'node-config-input-'+item.k)
                                        .attr('placeholder', item.k)
                                        //.add('placeHoler', item.k)
                                );
                                formRows.after(formRow);
                        });
                    } 
                }

```

And in the console debugger of a browers, I have:

```auto
// At the start
$(".test-franck")
// ==> empty
// after opening config node
----------------prepare gui-----
i= 0
i= 1
$(".test-franck"); // A lot of objects
div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck, div.form-row.test-franck

// And it increasse each time i open the config node

```

---

<div class="post-metadata">

**Author:** ![francxk](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@francxk](https://discourse.nodered.org/u/francxk)\
**Post date:** [23 October 2019 07:10 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/4 "2019-10-23T07:10:47Z")

</div>

Correction for the `DOM`, my selector was to naive.

```auto
                oneditprepare: function() {
                    var formRows = $("#last-static-row"); // <-- better selector
                    console.log("----------------------");
                    console.log(this);
                    if ( ofogtype.varList && ofogtype.varList.export) {
                        console.log("----------------prepare gui-----");
                        guiWidgetPrepared=true;
                        $.each(ofogtype.varList.export, function(i, item) {
                            // put in GUI
                            console.log("i=", i);
                            var formRow=$('<div>').addClass("form-row").addClass("test-franck")
                                .append(
                                    $('<label/>').attr("for", 'node-config-input-'+item.k).text(item.k)
                                        .prepend($('<i/>').addClass("icon-tag")),
                                    $('<input/>',{type:"text"}).attr('id', 'node-config-input-'+item.k)
                                        .attr('placeholder', item.k)
                                        //.add('placeHoler', item.k)
                                );
                                formRows.after(formRow);
                        });
                    } 
                }

```

but it is not correct my problem, previously set values not retrieve

---

<div class="post-metadata">

**Author:** ![francxk](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@francxk](https://discourse.nodered.org/u/francxk)\
**Post date:** [23 October 2019 15:31 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/5 "2019-10-23T15:31:49Z")

</div>

No other progress, try a lot... may be i lose some events

---

<div class="post-metadata">

**Author:** ![francxk](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@francxk](https://discourse.nodered.org/u/francxk)\
**Post date:** [23 October 2019 15:59 UTC](https://discourse.nodered.org/t/lately-adding-properties-on-configuration-node/17025/6 "2019-10-23T15:59:07Z")

</div>

Not proud of that, but it works ! forcing the value for the input:

```auto
                oneditprepare: function() {
                    var formRows = $("#last-static-row");
                    var currentConfignode=this;
                    if ( ofogtype.varList && ofogtype.varList.export) {
                        guiWidgetPrepared=true;
                        $.each(ofogtype.varList.export, function(i, item) {
                            // put in GUI
                            var formRow=$('<div>').addClass("form-row").addClass("test-franck")
                                .append(
                                    $('<label/>').attr("for", 'node-config-input-'+item.k).text(item.k)
                                        .prepend($('<i/>').addClass("icon-tag")),
                                    $('<input/>',{type:"text"}).attr('id', 'node-config-input-'+item.k)
                                        .attr('placeholder', item.v).val(currentConfignode[item.k])
                                );
                                formRows.after(formRow);
                        });
                    } 
                }

```
