Versions Compared

Old Version 2

changes.mady.by.user Derek Chen

Saved on

compared with

New Version 3

changes.mady.by.user Derek Chen

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
  1. Determine the Form Grid Field ID. In this example, it is "FGid".

  2. Add below script to Custom HTML

    Code Block
    languagejs
    titleCode
    linenumberstrue
    Javascript here to delete row.<br/>
<script>
$(function(){
    var grid = FormUtil.getField("FGid");
    
    $(grid).on("change", function(){
        //add delete button
        $(grid).find("tr.grid-row").each(function(i, row){
            if($(row).find("td.grid-action-cell .delete").length === 0) {
                $(row).find("td.grid-action-cell").append("<a class=\"delete\">Delete</a>");
            }
        });
    });
    $(grid).trigger("change");  //trigger change to add buttons to the existing rows
    
    $(grid).on("click", ".delete", function(){
        
        var row = $(this).closest("tr");
        var table = $(row).closest("table");
        var container = $(table).parent();
        var deleteMessage = $(container).find('#deleteMessage').val();
            
        row.remove();
            
        // reset input names
        methods.updateAllRowIndex(table);
        methods.disabledMoveAction(table);
            
        // trigger change
        var el = table.parent();
        $(el).trigger("change");
        methods.showHidePlusIcon(el);
    })
})
</script>
  3. Open the form in userview, now you can delete the row without confirmation through the delete button


Related Tutorial