Click here to Skip to main content
15,885,985 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I have a view as follows
@if(Model.Is_Prefix_Checked == 1)
{
    <div class="row mb-2">
    <div>
        <div class="col-md-1" style='align-content:center;'>
            <input type="checkbox" class="largerCheckbox" id="Is_Prefix_Checked" name="IsPrefixChecked" checked="checked" >
        </div>
    </div>
    
    <label class="col-sm-2 col-form-label">Prefix</label>
    <div class="col-sm-3">
        <select asp-for="EmployeePrefix" class="form-control" asp-items="@ViewBag.prefix"  >
        </select>
        <span asp-validation-for="EmployeePrefix" class="text-danger" ></span>
    </div>
    
</div>
}
else
{
    <div class="row mb-2">
    <div>
        <div class="col-md-1" style='align-content:center;'>
            <input type="checkbox" class="largerCheckbox" id="Is_Prefix_Checked" name="IsPrefixChecked">
        </div>
    </div>
    
    <label class="col-sm-2 col-form-label">Prefix</label>
    <div class="col-sm-3">
        <select asp-for="EmployeePrefix" class="form-control" asp-items="@ViewBag.prefix">
        </select>
        <span asp-validation-for="EmployeePrefix" class="text-danger"></span>
    </div>
    
</div>

}


when i click on the checkbox i am getting the value , but when i come back to the page the checkbox is already clicked and now when i try to update the form the already clicked checkbox value are showing as 0 instead of 1 .

I need to do this for more than for 20 fields in each page

My jquery is as follows

What I have tried:

JavaScript
window.onload = function () {
    func2();
}

function func2() {
    window.onload=function()
    {
         const checkBoxes=document.querySelectorAll("input[type='checkbox']");
         const checkBoxes = document.querySelectorAll
        for(var i=0; i < checkBoxes.length; i++) 
        {
            if (this.checked) 
            {
                $(this).attr("value", "1");
            } else
            {
                $(this).attr("value", "0");
            }
        }
    }
}


// this is the scrpt for checkbox
$(document).on("click", "[type='checkbox']", function (e) {
    if (this.checked) {
        $(this).attr("value", "1");
    } else {
        $(this).attr("value", "0");
    }
});
Posted
Updated 6-Feb-23 0:57am
v2
Comments
Richard Deeming 6-Feb-23 7:00am    
Your code makes no sense. Your onload event handler calls another function which attaches another onload event handler. You have two lines assigning the constant checkBoxes variable, one of which is incomplete and generate a compiler error. And changing the value of a checkbox is irrelevant, since only the checked items will be submitted with the form.
Richard Deeming 6-Feb-23 7:02am    
Also, why have you duplicated the markup in your @if and else branches? The only thing different between them is the checked attribute, which can be handled with the asp-for helper.
<input type="checkbox" class="largerCheckbox" id="Is_Prefix_Checked" asp-for="@Model.Is_Prefix_Checked">
Member 13998042 6-Feb-23 7:17am    
Dear Richard,

The reason i am asking to change the value of the check box is because when i move back to the previous page the if the checkbox is checked , When updating the value it goes back to 0 again instead of 1.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900