I have a dynnamic grid in which user can add as many rows as he wants. On addition of rows, he will select a type, and against that type will enter a minimum value and a maximum value.
Type Minimum Value MaximumValue AddRow
ABC 12 13 (icon)
XYZ 12 13 (icon)
ABC 12 13 (icon)
Here is an example. The user selects type ABC and enters the ranges. In second row , the user has selected a different type and enters the ranges. In the third row, the user has selected a type and enters the same ranges as the first row. The same type can not have the same range again. moreover, there should be no overlapping as well. So on saving I want to do something to restrict the user to not enter the same range against that type if he has already entered once before. I am confused as How can I do this?
So Far this is what I have done for the validation.
if (map.has(CustomerTypeCode)) {
var obj = map.get(CustomerTypeCode);
if (minVal >= obj.minVal && maxVal <= obj.maxVal) {
alert("Duplicate Ranges Found!");
}
} else {
map.set(type, {
minVal: minVal,
maxVal: maxVal
})
}
You can use Map to achieve what you want.
//You must declare your map at global scope or outer scope of this operation
//so that you don't create new map every time
const map = new Map();
let minVal = $(this).find("td:eq(3)").find("input").val();
let maxVal = $(this).find("td:eq(4)").find("input").val();
// I don't know your html so I assume you can get selected type
let type = "ABC";
if (map.has(type)) {
let obj = map.get(type);
if (minVal >= obj.minVal && maxVal <= obj.maxVal) {
alert("Duplicate Ranges Found!");
}
} else {
map.set(type, {
minVal: minVal,
maxVal: maxVal
})
}