JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span8">
<h3>Контакт:</h3>
<dl class="contact table table-bordered">
<div class="row-fluid"><dt class="fn span3">Идентификатор</dt><dd class="fn span9"><label class="checkbox"><input type="checkbox" id="0/com.act4contact.Contact$FN/null/27596733" checked disabled="disabled"><div class="value">Пупкин В. В.</div></label></dd></div>
<div class="row-fluid"><dt class="n span3">Имя</dt><dd class="n span9"><label class="checkbox"><input type="checkbox" id="1/com.act4contact.Contact$Name/null/28943672" checked><div class="value">д.ю.н. Пупкин Василий Васильевич</div></label></dd></div>
<div class="row-fluid"><dt class="org span3">Организация (раб.)</dt><dd class="org span9"><label class="checkbox"><input type="checkbox" id="2/com.act4contact.Contact$Org/work/17704280" checked><div class="value">Адвокатская контора "Пупкин и партнеры"<br><br>Старший партнер</div></label></dd></div>
<div class="row-fluid"><dt class="adr span3">Адрес (дом.)</dt><dd class="adr span9"><label class="checkbox"><input type="checkbox" id="3/com.act4contact.Contact$Address/home/1815387" checked><div class="value">Москва, ул. Высокая, д. 20, кв. 51</div></label></dd></div>
<div class="row-fluid"><dt class="adr span3">Адрес (раб.)</dt><dd class="adr span9"><label class="checkbox"><input type="checkbox" id="3/com.act4contact.Contact$Address/work/28693170" checked><div class="value">119333<br>Россия<br><br>Москва<br>Ленинский пр-тд. 55/1, стр. 1</div></label></dd></div>
<div class="row-fluid"><dt class="email span3">E-mail (проч.)</dt><dd class="email span9"><label class="checkbox"><input type="checkbox" id="5/com.act4contact.Contact$Email/other/10232210" checked><div class="value"><a href="mailto:vasya@pupkin-and-partners.ru">vasya@pupkin-and-partners.ru</a></div></label></dd></div>
<div class="row-fluid"><dt...
CSS
dl.contact div.value.disabled {
text-decoration: line-through;
color: #808080;
}
JavaScript
$(document).ready(function(){
function ajaxQueue(func){
$(document).queue("ajax",func);
if($(document).queue("ajax").length == 1)
$(document).dequeue("ajax");
}
$("input:checkbox")
.change(function(){
var $_ = $(this),
checked = $_.is(":checked"),
parentDiv = $_.parents("dd").find("div.value");
if(!checked)
parentDiv.addClass("disabled");
else
parentDiv.removeClass("disabled");
$_.attr("disabled","disabled");
ajaxQueue(
function(){
$.post("/echo/html",
{name: $_.attr("id"),
value: checked})
.error(function(){
$_.val((!checked)?"on":"off");
})
.complete(
setTimeout( //only for demo purposes
function() {
$_.removeAttr("disabled");
$(document).dequeue("ajax");
}
,2000)
);
});
});
});