在某种情况下无法禁用div [英] Unable to keep a div disabled under a certain condition
本文介绍了在某种情况下无法禁用div的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试在用户未注册时启用发送注册div作为按钮，但启用编辑按钮（div）并在用户注册时禁用发送注册。
这是我的Razor视图：
I'm trying to enable a Send Registration div acting as a button when the user is not registered, but enable the edit button (div) and disable the Send Registration one when the user is registered.
Here's my Razor view:
<div class="contribution-list-results outer-box row">
@{
for (var i = 0; i < Model.ManageUsersVMList.Results.Count; i++)
{
<div class="col-xs-12 users-maintenance-list-results">
<div class="checkbox-col detail-form-group checkout-form-group checkout-checkbox detail-line-item-checkboxes"
data-user="@Model.ManageUsersVMList.Results[i].UserKey",
data-is-registered="@Model.ManageUsersVMList.Results[i].Login">
@Html.CheckBoxFor(m => m.ManageUsersVMList.Results.SingleOrDefault(x => x.UserKey == Model.ManageUsersVMList.Results[i].UserKey).ManageUsersListItemCheckbox, new
{
id = string.Format("ManageUsersListItemCheckbox{0}", i),
data_is_registered = Model.ManageUsersVMList.Results[i].Login
})
<label for="@(string.Format("ManageUsersListItemCheckbox{0}", i))"><div></div></label>
</div>
<div class="user-key-col-label hidden-md hidden-lg">@Model.UserKeyLabel: </div>
<div class="user-key-col admin-line-item">
@Model.ManageUsersVMList.Results[i].UserKey
</div>
<div class="fpid-col-label hidden-md hidden-lg">@Model.FPIDLabel:</div>
<div class="fpid-col admin-line-item">
@Model.ManageUsersVMList.Results[i].FPID
</div>
<div class="full-name-col-label hidden-md hidden-lg">@Model.NameLabel:</div>
<div class="full-name-col admin-line-item">
@Model.ManageUsersVMList.Results[i].Name
</div>
<div class="@(Model.IsPortraitExcluded ? "portrait-col-excluded-label" : "email-col-label") hidden-md hidden-lg">@Model.EmailLabel:</div>
<div class="@(Model.IsPortraitExcluded ? "portrait-col-excluded" : "email-col") admin-line-item">
@Model.ManageUsersVMList.Results[i].Email
</div>
<div class="login-col-label hidden-md hidden-lg">@Model.LoginLabel:</div>
<div class="login-col admin-line-item @(Model.ManageUsersVMList.Results[i].Login ? "true-checkmark" : "red-x")"></div>
<div class="hidden-md hidden-lg @(Model.IsPortraitExcluded ? "portrait-col-excluded-role-label" : "role-col-label")">@Model.RoleLabel:</div>
<div class="admin-line-item @(Model.IsPortraitExcluded ? "portrait-col-excluded-role" : "role-col") @(Model.ManageUsersVMList.Results[i].Role ? "true-checkmark" : "red-x")"></div>
@*@if (!Model.IsPortraitExcluded)
{
<div class="portrait-col-label hidden-md hidden-lg">@Model.PortraitLabel:</div>
<div class="portrait-col admin-line-item @((Model.ManageUsersVMList.Results[i].Portrait) ? "true-checkmark" : "red-x")"></div>
}*@
</div>
}
<div class="bottom-buttons col-xs-12">
<div class="manage-users-registration resend-registration-button-disabled">
@Html.HiddenFor(x => x.RegistrationUrl)
<label>@Model.ManageUsersRegistrationLabel</label>
</div>
<div class="manage-users-edit edit-button-disabled">
@Html.HiddenFor(x => x.EditUrl)
<label>@Model.ManageUsersEditLabel</label>
</div>
</div>
}
</div>
我的尝试：
这是我控制按钮的JavaScript函数：
What I have tried:
Here's my JavaScript function that controls the buttons:
function IsSendRegistrationOrEdit() {
var numberOfCheckedBoxes = 0;
$('#ManageUsers .detail-line-item-checkboxes input[type=checkbox]').each(function () {
if ($(this).is(':checked'))
numberOfCheckedBoxes++;
});
var adminMergeButton = $('.admin-merge-button');
if (numberOfCheckedBoxes >= 2) {
adminMergeButton.removeClass('admin-button-disabled');
adminMergeButton.addClass('blue-border-submit-button background-hover-transition');
}
else {
adminMergeButton.removeClass('blue-border-submit-button background-hover-transition');
adminMergeButton.addClass('admin-button-disabled');
}
var manageUsersEdit = $('.manage-users-edit');
var CheckBoxes = document.getElementsByTagName('input[type=checkbox]');
var userLogged = CheckBoxes.data('is-registered') === 'True';
var resendEmail = $('.manage-users-registration');
if (numberOfCheckedBoxes === 1) {
manageUsersEdit.removeClass('edit-button-disabled');
manageUsersEdit.addClass('blue-border-submit-button background-hover-transition');
if ((checkBoxInput.is(':checked')) && (!userLogged))
{
resendEmail.removeClass('resend-registration-button-disabled');
resendEmail.addClass('blue-border-submit-button background-hover-transition');
}
else {
resendEmail.removeClass('blue-border-submit-button background-hover-transition');
resendEmail.addClass('resend-registration-button-disabled');
}
}
else {
manageUsersEdit.removeClass('blue-border-submit-button background-hover-transition');
manageUsersEdit.addClass('edit-button-disabled');
}
};
请帮助我。提前感谢您的时间！
Please help me. Thank you in advance for your time!
推荐答案
（' #ManageUsers .detail-line-item-checkboxes输入[type = checkbox]'）。each（ function （）{
if （
('#ManageUsers .detail-line-item-checkboxes input[type=checkbox]').each(function () { if (
（ this ）。是（' ：checked'））
numberOfCheckedBoxes ++;
}）;
var adminMergeButton =
(this).is(':checked')) numberOfCheckedBoxes++; }); var adminMergeButton =
（' 。admin-merge-button'）;
if （numberOfCheckedBoxes> = 2 ）{
adminMergeButton .removeClass（' admin-button-disabled'）;
adminMergeButton.addClass（' blue-border-submit-button background-hover-transition' ）;
}
else {
adminMergeButton.removeClass（' blue-border-submit-button background-hover-transition'）;
adminMergeButton.addClass（' admin-button-disabled'）;
}
var manageUsersEdit =
('.admin-merge-button'); if (numberOfCheckedBoxes >= 2) { adminMergeButton.removeClass('admin-button-disabled'); adminMergeButton.addClass('blue-border-submit-button background-hover-transition'); } else { adminMergeButton.removeClass('blue-border-submit-button background-hover-transition'); adminMergeButton.addClass('admin-button-disabled'); } var manageUsersEdit =
这篇关于在某种情况下无法禁用div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
