Waqas Ahmad
Waqas Ahmad

Reputation: 416

How check a checkbox and show a input field in jQuery?

I have made a function which returns JSON response and the values coming from this response is showed in the input fields.

this is table when I clicked the edit button. it sends a request to the master_get_items file and receives the response

Table image

enter image description here Response for ID No 4

    {
  "ID": "4",
  "item_title": "slaePrice",
  "item_price": "99999.99",
  "big_pic": "front/images/items/dcba27227bc0f165910a5ba5979a3811.png",
  "item_description": "<p>dsfsdfs</p>\r\n",
  "sale_price": "23",
  "status": "enabled"
}

this response has a sale_price of 23. so I made an if statement in JQuery if the sale_price value is greater then 0. then check the checkbox and show the input field which works well.

but when I click the edit button of ID no 5 in the response the value of sale_price is null but still the checkbox is checked and the input field is shown.

Response for ID No 5

{
  "ID": "5",
  "item_title": "asd",
  "item_price": "2.00",
  "big_pic": "front/images/items/d73a11ab42e2974df57612e8a0d7ce01.png",
  "item_description": "<p>adsfsadfsdfsdfsd</p>\r\n",
  "sale_price": null,
  "status": "enabled"
}

The if statement which I have write

  var sale_product = "";
sale_product = outputData.sale_price;
if (sale_product !== "") {
    $("#Editsale").prop("checked", true);
    $("#EditsalePrice").show();
    modal.find("input#Editsale_price").val(outputData.sale_price);
} else if (sale_product == "") {
    $("#Editsale").prop("checked", false);
    $("#EditsalePrice").hide();
}

HTML code for Checkbox and input fields

    <div class="col-md-3">
   <div class="form-group">
      <label for="Sale">Product On Sale?</label>
      <input type="checkbox" id="Editsale" name="Editsale" class="checkbox checkboxsize">
   </div>
</div>
<div id="EditsalePrice" style="display:none">
   <div class="col-sm-3">
      <div class="form-group">
         <label for="">Sale Price</label>
         <input type="text" name="Editsale_price" id="Editsale_price" placeholder="Enter Product Sale Price" class="form-control">
      </div>
   </div>
</div>

let see image for ID no 4

enter image description here

let see image for ID no 5

enter image description here

Upvotes: 1

Views: 119

Answers (3)

Waqas Ahmad
Waqas Ahmad

Reputation: 416

Thnx to all of you. I have correct it by doing if(sale_product != null) and it works.

Upvotes: 1

Sam.92
Sam.92

Reputation: 96

try adding in !empty(sale_product) { to your if statement

Upvotes: 0

gidanmx2
gidanmx2

Reputation: 469

Try changing if (sale_product !== "") with if (sale_product) { and remove the else if. This check if the value is not false, null, undefined, empty string, 0 or NaN

Upvotes: 0

Related Questions