Проблема, заключающаяся в том, что javascript не может быть применен в зависимости от того, установлен ли параметр URL

Есть раскрывающийся список (выберите опцию), чтобы выбрать, следует ли is_recruiting, радио-опцию, чтобы выбрать «Всего» или «Период», и входной тег «from_date» и «to_date», чтобы установить дату при выборе «Периода».

Когда опция радио расположена по центру и выбрано «Всего», тег ввода даты не может быть введен, и можно выбрать опцию набора. И наоборот, если выбран «Период», параметр набора блокируется, и можно установить период (от_даты и до_даты).

<form action = "/chart" method = "GET">
    <select name = "is_recruiting" id = "is_recruiting" class = "ml-4">
        <option value = "A" {% if is_recruiting == "A" %} selected {% endif %}>A</option>
        <option value = "B" {% if is_recruiting == "B" %} selected {% endif %}>B</option>
        <option value = "ALL" {% if is_recruiting == "ALL" %} selected {% endif %}>ALL</option>
    </select>
    <div class = "radio" style = "display: inline">
      <label><input type = "radio" name = "optionRadios" value = "total" {% if option_radio != 'period' %} checked {% endif %}/> Total </label>
    </div>
    <div class = "radio" style = "display: inline">
      <label><input type = "radio" name = "optionRadios" value = "period" {% if option_radio == 'period' %} checked {% endif %}/> Period : </label>
        <input autocomplete = "off" class = "datepicker" name = "from_date" id = "fromDate" value = {{from_date|default_if_none:''}}>
        <label> ~ </label>
        <input autocomplete = "off" class = "datepicker" name = "to_date" id = "toDate" value = {{to_date|default_if_none:''}}>
    </div>
    <button class = "btn btn-primary btn-xs mb-1" type = "submit">Submit</button>
</form>


<script>
    $('input[type=radio][name=optionRadios]').on('click',function () {
    var chkValue = $('input[type=radio][name=optionRadios]:checked').val();
    var recruitingSelect = document.getElementById("is_recruiting");

    if (chkValue == 'total'){
        $( '#fromDate' ).attr('disabled', 'disabled').val('');
        $( '#toDate' ).attr('disabled', 'disabled').val('');

    }
    elif (chkValue == 'total'){
        $( '#fromDate' ).removeAttr('disabled');
        $( '#toDate' ).removeAttr('disabled');
    }

    if (chkValue == 'period'){
        recruitingSelect.disabled = true;
    }
    else {
        recruitingSelect.disabled = false;
    }
});
</script>

Если в URL-адресе нет параметров is_recruiting или optionRadios, from_date, to_date, приведенный выше код JavaScript работает нормально, но если вы выберете вариант, отправите один раз и включите параметры в URL-адрес, JavaScript не применяется. Что не так?

http://127.0.0.1:8000/диаграмма/ -> применен JavaScript http://127.0.0.1:8000/chart/?is_recruiting=A&optionRadios=total -> JavaScript не применяется