Ajax data Option if no button disabled-CodePudding

Hi i needed help with my button to be disabled that if the option selected = No it be disabled if Yes it be enabled

I am using my ajax to call for the option

This is my html code for the option and button

 <label for="select-Require-CDS" >Require CDS</label> 
  <br/>
  <select  id="select-Require-CDS" required>
    <option selected disabled value="">Select ....</option> 
  </select>
  <div >
    Please select a valid option .
</div>

  <button id="select-Yes-No" style="margin-left: 10px; ">Select</button>

This is my ajax code

$.ajax({
    // The url that you're going to post 
    /* 
    
    This is the url that you're going to put to call the
    backend api,
    in this case, it's 
    https://ecoexchange.dscloud.me:8080/api/get (production env)

    */
    url:"https://ecoexchange.dscloud.me:8090/api/get",
    // The HTTP method that you're planning to use
    // i.e. GET, POST, PUT, DELETE 
    // In this case it's a get method, so we'll use GET
    method:"GET",
    // In this case, we are going to use headers as 
    headers:{
        // The query you're planning to call
        // i.e. <query> can be UserGet(0), RecyclableGet(0), etc.
        query:"RequireGet()",
        // Gets the apikey from the sessionStorage
        apikey:sessionStorage.getItem("apikey")
    },
    success:function(data,textStatus,xhr) {
        console.log(data);
        for (let option of data) {
            $('#select-Require-CDS').append($('<option>', {
                value: option.RequireOption,
                text: option.RequireOption
            }));
        }
                                                    },
    error:function(xhr,textStatus,err) {
        console.log(err);
    }
});

and this is how my json response is

[
    {
        "RequireOption": "No"
    },
    {
        "RequireOption": "Yes"
    }
]

So my website display it be like this

Now how can i say that i select option as No the button is disabled but if yes is enabled ??

How that if no it be disabled as well ?

CodePudding user response：

$('#select-Require-CDS').on('change', function(){
    if($(this).val()=='Yes'){
        $('#select-Yes-No').attr('disabled',false) //button is now enabled
    }else{
        $('#select-Yes-No').attr('disabled',true) //button is now disabled
    }
});

This is an handler listening for change on the select. Based on what is selected then it adapt the button availability. It is untested but should do the trick.

I have used .on because you are adding the attributes later with ajax (later = after dom ready) so .change will not work on these options