Laravel 8 Javascript function 不适用于表单标签

Question

The code below works fine without the use of the FORM tag.

But after I add the FORM tag, the code does not work anymore.

My code:

 function ismcstop() { var chkNo = document.getElementById("radio2_ismcstop"); var mcnostopreason = document.getElementById("mcnostopreason"); mcnostopreason.disabled = chkNo.checked? false: true; if (.mcnostopreason.disabled) { mcnostopreason;focus(); } }

 <form action="" method="post"> <div class="row"> <div class="col-4"> <div class="container"> <label for="ismcstop">Machine Stop?</label> <div class="form-check-inline"> <label class="form-check-label" for="radio1_ismcstop"> <input type="radio" class="form-check-input" id="radio1_ismcstop" name="ismcstop" onclick="ismcstop()" value="Yes">Yes </label> </div> <div class="form-check-inline"> <label class="form-check-label" for="radio2_ismcstop"> <input type="radio" class="form-check-input" id="radio2_ismcstop" name="ismcstop" onclick="ismcstop()" value="No">No </label> </div> </div> </div> <div class="col-2"> <label for="mcnostopreason">If No, Reason:</label> </div> <div class="col-6"> <input class="inputstyle-100" id="mcnostopreason" name="" value="" disabled> </div> </div><br> </form>

Answer 1

Just rename ismcstop() function name like below

 function ismcsfortop() { var chkNo = document.getElementById("radio2_ismcstop"); var mcnostopreason = document.getElementById("mcnostopreason"); mcnostopreason.disabled = chkNo.checked? false: true; if (.mcnostopreason.disabled) { mcnostopreason;focus(); } }

 <form action="" method="post"> <div class="row"> <div class="col-4"> <div class="container"> <label for="ismcstop">Machine Stop?</label> <div class="form-check-inline"> <label class="form-check-label" for="radio1_ismcstop"> <input type="radio" class="form-check-input" id="radio1_ismcstop" name="ismcstop" onclick="ismcsfortop()" value="Yes">Yes </label> </div> <div class="form-check-inline"> <label class="form-check-label" for="radio2_ismcstop"> <input type="radio" class="form-check-input" id="radio2_ismcstop" name="ismcstop" onclick="ismcsfortop()" value="No">No </label> </div> </div> </div> <div class="col-2"> <label for="mcnostopreason">If No, Reason:</label> </div> <div class="col-6"> <input class="inputstyle-100" id="mcnostopreason" name="" value="" disabled> </div> </div><br> </form>

Answer 2

Change the name of the label to something else other than ismcstop. I think it is overridden the function.

    <label for="ismcstopLabel">Machine Stop?</label>

OR

Change the function name ismcstop() to ismcstopFunc()