У вас есть по крайней мере эти пять вариантов моделирования иерархии типов, которую вы описываете:
Я написал об этом больше в презентации, Расширяемое моделирование данных .
Дополнительные мысли о EAV: Хотя многие люди предпочитают EAV, я этого не делаю. Это похоже на самое гибкое решение, и, следовательно, лучшее. Однако имейте в виду поговорку TANSTAAFL . Вот некоторые из недостатков EAV:
NOT NULL
). JOIN
для каждого атрибута. Степень гибкости EAV дает вам жертвы в других областях, возможно, делая ваш код сложным (или хуже), чем это было бы для решения исходной проблемы более обычным способом.
И в большинстве случаев, нет необходимости иметь такую степень гибкости. В вопросе OP о типах продуктов гораздо проще создать таблицу для каждого типа продукта для атрибутов, специфичных для продукта, поэтому у вас есть некоторая согласованная структура, принудительная, по крайней мере, для записей одного и того же типа продукта.
I ' d использовать EAV только в том случае, если каждой строке должно быть разрешено потенциально иметь отдельный набор атрибутов. Когда у вас есть конечный набор типов продуктов, EAV является излишним. Класс Наследование наследования был бы моим первым выбором.
$("#total").click(function(){
$("#yourtable tr").each(function(i, el){ //go through each tr in table id=yourtable
var a = $(el).find(".a").val(); //find .a in each row
var b = $(el).find(".b").val(); //find .b in each row
var tt = a+b;
$(el).find('.a-b').text(tt); //set result into .a-b of current row
};
});
Использовал номер типа ввода, чтобы избежать проблемы с конкататом строк. Также проверяется на действительное число после добавления с помощью isNan , иначе он назначит пустое значение в столбце. Вы также можете добавить сообщение об ошибке здесь.
$("#total").click(function() {
$("tbody tr").each(function() {
var a = ($(".a", this).val());
var b = ($(".b", this).val());
var tt = a + b;
if (!isNaN(tt))
$('.a-b', this).text(tt);
else
$('.a-b', this).text(''); //your error message if addition is invalid
})
});
td,
th {
border: solid 1px #000;
padding: 5px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<thead>
<tr>
<th>a</th>
<th>b</th>
<th>a+b</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="number" class="a"></td>
<td><input type="number" class="b"></td>
<td><label class="a-b"></label></td>
</tr>
<tr>
<td><input type="number" class="a"></td>
<td><input type="number" class="b"></td>
<td><label class="a-b"></label></td>
</tr>
</tbody>
</table>
<button id="total">total</button>