Home > OS >  How to add inline Javascript if condition to dropdown value?
How to add inline Javascript if condition to dropdown value?

Time:07-07

How can I add an if condition within the code so that I can enable/disable the select based on boolean flag?

I have defined boolean property named isEnable. Based on this value I want to enable/disable the dropdown value <option value="Close"> Close Amount</option>.

Something like - if(isEnable) then enable or disable Close Amount dropdown value

initGrid: function() {
  var self = this;
  this.isEnable = false;
  this._onlineIDDetailsGrid = this.findControl("#onlineIDDetailsGrid").DataTable({
    "columnDefs": [{
      className: "dt-body-center",
      "targets": [0, 3, 4, 5]
    }],
    "columns": [{
      "title": "Actions",
      "render": function(data, type, full) {
        return '<select  disabled="disabled"> <
          option value = "" > Select Action < /option> <
          option value = "SUSPEND" > Suspend < /option> <
          option value = "Close" > Close Amount < /option>;--------------------> This dropdown option
      }
    },
  }

CodePudding user response:

To do what you require you can use a ternary expression to concatenate the disabled attribute to the select HTML if isEnable is false. This can be made simpler still by using a template literal:

"columns": [{
    "title": "Actions",
    "render": function(data, type, full) {
      return `<select >
        <option value="">Select Action</option>
        <option value="SUSPEND">Suspend</option> 
        <option value="Close" ${(self.isEnable ? '' : 'disabled="disabled"')}>Close Amount</option>
      </select>`
    }
  },
  • Related