How to change add another[object] behavior in TabularInline

Question

I want to make an admin InlineTabular add another object button and take me to the object add page with prepopulated fields instead of creating an inline model - Add Another[Object] button.

I tried to override the html and add the hard coded url in the <a> tag by sending extra context in my admin model, but it didn't work.

class SupplierAdmin(admin.ModelAdmin):
    inlines = [ProductViewInline,]
    def change_view(self, request, object_id, form_url='', extra_context=None):
        extra = extra_context or {}
        extra['ProductUrl'] = 'http://localhost:8000/admin/products/product/add/'

        return super(SupplierAdmin, self).change_view(request, object_id,
                                                        form_url, extra_context=extra)

# Tabular.html
<script>
  ProductUrl = '{{ ProductUrl }}'
</script>

# Inline.js
const addInlineAddButton = function() {
            ...
     $parent.append('<tr class="' + options.addCssClass + '"><td colspan="' + numCols + `"><a href=ProductUrl>` + options.addText + "</a></tr>");
                    addButton = $parent.find("tr:last a");
                } else {
                   ...