CODEWITHSUNDEEP
javascriptjquerytypescript
Balance
Balance

Reputation: 581

Property 'checked' does not exist on type 'HTMLElement'.

I have this code in typescript file

 function debug_show_removed_flights() {
    if ($('.debug-window #show_removed_flights')[0].checked) {
      $('.fly-schedule-removed_reason').show();
      return $('.fly-schedule-remove').show();
    } else {
      $('.fly-schedule-removed_reason').hide();
      return $('.fly-schedule-remove').hide();
    }
  };

But in this row, I have error.

if ($('.debug-window #show_removed_flights')[0].checked) {

[ts] Property 'checked' does not exist on type 'HTMLElement'.

How I can fix it?

Upvotes: 25

Views: 27796

Answers (2)

Mussa Charles
Mussa Charles

Reputation: 849

Add HTMLInputElement inline as following


function debug_show_removed_flights() {

    const input = $('.debug-window #show_removed_flights')[0];

    if ((input as HTMLInputElement).checked) {
        $('.fly-schedule-removed_reason').show();
        return $('.fly-schedule-remove').show();
    } 
    else if (!(input as HTMLInputElement).checked) {
        $('.fly-schedule-removed_reason').hide();
        return $('.fly-schedule-remove').hide();
    }
}

Upvotes: 4

Cyril Gandon
Cyril Gandon

Reputation: 17058

Only HTMLInputElement have the checked property. You can cast your element so it will transpile:

function debug_show_removed_flights() {
    const input = $('.debug-window #show_removed_flights')[0] as HTMLInputElement;
    if (input.checked) {
        $('.fly-schedule-removed_reason').show();
        return $('.fly-schedule-remove').show();
    } else {
        $('.fly-schedule-removed_reason').hide();
        return $('.fly-schedule-remove').hide();
    }
}

Upvotes: 49

Related Questions