# Dynamically control whether the attribute is required

**URL:** <https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253>\
**Category:** General\
**Created:** [15 June 2019 06:24 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253 "2019-06-15T06:24:42Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 06:24 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/1 "2019-06-15T06:24:42Z")

</div>

How to dynamically modify the required value of a field to dynamically control whether the attribute is required。

```auto
    oneditprepare: function () {
            $("#node-input-payloadType").change(()=>{
                console.log('$("#node-input-payloadType").val()',$("#node-input-payloadType").val());
                if($("#node-input-payloadType").val()==='default'){
                    this._def.defaults.datasource.required=false;
                }else{
                    this._def.defaults.datasource.required=true;
                }
            });

    }

```

I tried to use the code shown above and it didn't work.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [15 June 2019 08:27 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/2 "2019-06-15T08:27:16Z")

</div>

I did this in my node-red-contrib-image-tools image node.

When building the typedinput, I check a property and add or don't add the validator.

Line 508...

> <https://github.com/Steve-Mcl/node-red-contrib-image-tools/blob/master/jimp.html>

---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 09:22 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/3 "2019-06-15T09:22:53Z")

</div>

@Steve-Mcl  
Hello  
I want to dynamically change the required value. Triggered by button click, required: true when certain conditions are met, false if other conditions are met

Thanks

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [15 June 2019 10:03 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/4 "2019-06-15T10:03:22Z")

</div>

The validation can be a function. So your button should set a variable and then you write a function that reads the variable to know whether the return is true or false.

---

<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:** [15 June 2019 13:58 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/5 "2019-06-15T13:58:50Z")

</div>

Just to be clear, you _cannot_ dynamically change the `required` flag. You _must_ use a custom validation function as has been suggested.

---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 16:04 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/6 "2019-06-15T16:04:18Z")

</div>

@knolleary  
hi，  
I tried it according to the method you said. It is possible to complete this function. However, it is still a little problem. I have recorded the screen and I don’t know how to share it with you.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [15 June 2019 16:12 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/7 "2019-06-15T16:12:56Z")

</div>

Publish to YouTube and share a link? Upload to Google photos and share a link? Put it on a file hosting site and share a link?

---

<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:** [15 June 2019 16:15 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/8 "2019-06-15T16:15:03Z")

</div>

Not sure what a video will demonstrate that you can't just describe. You have not shared what you have tried setting your validate function to. You have not described what behaviour you want. A video isn't going to provide that information.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [15 June 2019 17:21 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/9 "2019-06-15T17:21:52Z")

</div>

So as I posted to a link where I demonstrate using a function to validate (based on if the parameter is optional or not) and the suggestion by others, the key to enabling/disabling validation is in the validate function.

Example, if you add a validate function and return true - validation will pass. Based on that knowledge, use a flag to override the check.

E.g when you setup your typedinput, add a validate function....

```auto

let opts = {
                    default: 'msg',
                    typeField: $('#myTypedInputType'),
                    types: ['str', 'msg'],
                    validate: function(v) { 
                        let dontValidate = !$('#checkbox').val();
                        if(dontValidate){
                            return true;//don't validate, just return true. 
                        }
                        return !!v;//do validation
                    }
                };

                let $ti = $('#myTypedInput');
                $ti.typedInput(opts);

```

---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 22:40 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/10 "2019-06-15T22:40:07Z")

</div>



---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 22:49 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/11 "2019-06-15T22:49:02Z")

</div>

As shown in the video above, the last item in the dialog-form has a hidden item called datasource. The default is default. When it is default, the datasource is hidden and not verified. When it is a datasource, the datasource is displayed and verified.  
In the current phenomenon, when datasource is selected, the result of the verification is false, which should be displayed in the red verification box. The page end is not rendered. You need to enter any other field that is not verified, and re-verify to display the red verification box with the datasource verification false.

```auto
            datasource: {
                value: "",
                //type: "graphql-data",
                //required: false
                validate: function() {
                    debugger
                    let pt = $("#node-input-payloadType").val();
                    let ds = $("#node-input-datasource").val();
                    let rlt;
                    pt === "datasource" && ds === "" ? rlt = false : rlt = true
                    console.log('validate_result', rlt);
                    return rlt;
                }

            }

```

---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 22:52 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/12 "2019-06-15T22:52:07Z")

</div>

@Steve-Mcl@knolleary @TotallyInformation  
Thank you very much for your patience and answer!

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [15 June 2019 23:02 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/13 "2019-06-15T23:02:55Z")

</div>

> [@limengsong](#):
>
> `pt === "datasource" && ds === "" ? rlt = false : rlt = true`

I've never seen this arrangement of JS before.

I suspect it should be...

```auto
rtl = (pt === "datasource" && ds === "") ? false : true;

```

---

<div class="post-metadata">

**Author:** ![limengsong](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/limengsong/32/9391_2.png) [@limengsong](https://discourse.nodered.org/u/limengsong)\
**Post date:** [15 June 2019 23:09 UTC](https://discourse.nodered.org/t/dynamically-control-whether-the-attribute-is-required/12253/14 "2019-06-15T23:09:46Z")

</div>

I have modified it as you said, but the phenomenon remains.  
The debug information of the browser in the video has validata\_result. When the first time is false, no red verification box is displayed. Only the second time