Oracle Apex Tabular Form: Delete unsaved rows without submitting

A common shortfall in Tabular Form functionality in APEX (amongst many) is that when you add a couple of rows and you wish to delete one without saving the form, you will end up losing the whole lot of rows entered.

This piece of code will help you avoid the problem. Put this in page header and in the DELETE button's attribute, set type as URL and javascript:delete_rows(); as target.

The way it works, if the checked row wasn't saved and it will be removed without page submission, otherwise the page will be submitted to remove it via normal mechanism.

<script language="JavaScript" type="text/javascript">
    function delete_rows()
    {
        var need_submit = 0;
        $("[name='f01']").each(function(){

        if($(this).attr("checked"))
        {
            if(this.value == 0) // new row, not saved. Checkbox value is 0
            {
                $(this).closest("tr").remove();
            }
            else    // row was saved before, need to be removed via page submission.
                need_submit = need_submit + 1;
           
        }

        });
       
        if(need_submit > 0)    // require submission?
            apex.submit('MULTI_ROW_DELETE');
           
        addTotal();   

    }

</script>