19. Grid Editing
The Problem
Inline ERP editing needs validation, focus/leave handling, calculated fields, and a way to write values back to the correct row.
The React Difficulty
React controlled inputs can implement editing, but the application must manage row state, input state, validation, and calculated values explicitly.
React Approach
function QtyCell({ row, onChange }) {
return <input
value={row.quantity}
onChange={e => onChange(row.id, +e.target.value)}
onBlur={() => recalculate(row.id)}
/>;
}
MS Approach
ManySet provides a direct runtime-oriented approach for this recurring business-application task.
g.bulkEdit = true;
g.onTextLeave = (row, field) => {
if (field === "Quantity")
g.setValue(row, "Total", g.value(row, "Quantity") * g.value(row, "Price"));
};
Why this way is useful in business applications :
The comparison is intended to show where ManySet supplies a business-application abstraction around a recurring task, while keeping HTML and JavaScript visible and directly usable.
Key Point :
ManySet reduces the amount of framework-specific composition required for this particular task, without requiring the React/Angular mechanism to be represented as inherently wrong or incapable.