I'm trying to validate one of the checkboxes is checked before going to the next/previous page, but it doesn't look like my check is hit. This website was originally done by someone else and I don't work on websites very often.
I have a set of forms that are filled out, and this is part of my second tab:
The first checkbox is as follows in RegistrationStep2.cshtml:
..
<tbody>
<tr>
<td>
<div class="col-md-12">
<div class="col-md-16">
<div>
@Html.EditorFor(model => model.PrivilegesS, new { htmlAttributes = new { @class = "RoleChk2" } })
<label for="PrivilegesS">(S)</label>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
After the table are the Next/Previous buttons:
<footer class="col-xs-12 form-group text-right">
@(Html.Kendo().Button()
.Name("Previous1")
.Content("Previous")
.Events(ev => ev.Click("onPreviousClick")))
@(Html.Kendo().Button()
.Name("Next4")
.Content("Next")
.HtmlAttributes(new { @class = "k-primary" })
.Events(ev => ev.Click("onNextClick")))
</footer>
I tried adding a script to see if any of the checkboxes are set in the model, but I never see an alert and it lets me go to the next screen, which is not good:
<script>
@*This is my script for my checkboxes..the following does not get hit when run code*@
$('input.Previous1'.on('click',
function () {
if (!model.PrivilegesS && !model.PrivilegesAJ && !model.PrivilegesT && !model.PrivilegesH && !model.PrivilegesE && !model.PrivilegesM && !model.PrivilegesFF) {
alert('At least one facility privilege must be selected');
return false;
}
}));
$('input.Next4'.on('click',
function () {
if (!model.PrivilegesS && !model.PrivilegesAJ && !model.PrivilegesT && !model.PrivilegesH && !model.PrivilegesE && !model.PrivilegesM && !model.PrivilegesFF) {
alert('At least one Facility privilege must be selected');
return false;
}
}));
</script>
I have ApplicantCapturedData.cs:
..
public bool PrivilegesS { get; set; }
public bool PrivilegesH { get; set; }
public bool PrivilegesFF { get; set; }
..has the list of checkbox variables here..
I also tried attaching it to an event in the button click like
https://demos.telerik.com/aspnet-mvc/button/events, but it already has an event on button click to next/previous.
****Updates****
* My script needs to run when the next/previous button is clicked, which is not a change event. If no checkboxes are checked, it's not going to trigger a change event to run the script. There are a bunch of Privilege checkboxes. At least one needs to be checked, but all of them (there's about 10 checkboxes, not all are shown) could be checked. I need to verify at least one is checked when the next/previous button is clicked. How do I do this?
* I'm removing the change scripts that aren't for my checkboxes, because if no checkboxes are checked, there is no change event. I just left them in because it was nearby in the code, and I thought maybe someone would have a suggestion that was similar that I hadn't thought of.
* Radial buttons wouldn't work here because there could be more than one Privilege selected. It's not a yes/no/maybe thing. These are buildings, and they could be in all of them at one point.
What I have tried:
The script shown to validate but it doesn't get hit, and also looked into button click event, but it already has a button click event.
I also added RoleChk2 class, but if no checkboxes are checked there's no click event to watch for that it gets checked.
I considered adding a variable to set if anything gets checked but I'm not that familiar with MVC so I'm not sure where to put it. Plus I'm not sure where to check if it's set if they hit next/previous.
I tried making just one checkbox required instead of the whole group like it should be with RoleChk2, and Required in my ApplicantCapturedData.cs, but never got a Required message when I added the (un)commented [Required part in ApplicantCapturedData.cs. This had worked with other form blank/strings to fill that I don't show.
@Html.EditorFor(model => model.PrivilegesS, new { htmlAttributes = new { @class = "RoleChk2", required="required" } })