Clear Form Grid Data on Field Change

Introduction

Managing dynamic form data can be challenging, especially when you must clear form grid data based on field changes. This guide demonstrates how to automatically delete all rows from a Form Grid when a specific field's value changes, helping you maintain a clean and accurate data entry process.

How does it work?

The provided JavaScript code listens for changes in a specified select field. When the value of this field changes, the code automatically removes all rows from the associated Form Grid. This ensures that the Form Grid is cleared of previous entries, which can be useful in scenarios where the selection affects the relevance of the grid data.

Code:

<script>
$(document).ready(function(){
    var selectField = "field1";
    var formGrid = "field2";
 
    //when select box value is changed
    $("[name="+selectField+"]:enabled").change(function(){
        //remove all data from form grid
        $("[name="+formGrid+"]").find("table tr.grid-row").remove();
    });
});
</script>