Search code examples
javascriptjqueryformsrazor-pagesdx-data-grid

Razor Page - Form not submitting


I am currently working on Razor Page (.NET Core 6). The problem I encountered is that form ("form_Download", in this case) is not submitting. The strange thing is that I also have similar code in other pages and it works properly. I wonder why the form is not submitted. Here are my codes:

General.cshtml

@page "{order_id}"
@model MyNameSpace.Pages.OrderSheet.Approve.GeneralModel
...
<form id="form_update" method="post" /> @*used for other post methods*@
...
<form id="form_Download" method="post" asp-page-handler="DownloadAttachment">
    <input id="hdn_AttachId" name="attach_id" type="hidden" />
</form>
@section Scripts {
    <script src="~/lib/DevExtreme/dx.all.js"></script>
    <script type="text/javascript">

        const formUpdate = document.querySelector("#form_update");

        $(() => {

            //...

            $('#grid_Attachment').dxDataGrid({
                dataSource: attachmentStore,
                columns: [{
                    caption: 'No',
                    dataField: 'attach_id',
                }, {
                    caption: 'Type',
                    dataField: 'type',
                }, {
                    caption: 'Name',
                    dataField: 'file_name',
                    cellTemplate(cell, info) {
                        const { data: { attach_id, file_name, file_extension } } = info.row;
                        $('<div>')
                            .html(`<a href="#" class="dx-link dx-link-edit" onclick="DownloadAttachment(${attach_id})">${file_name}${file_extension}</a>`)
                            .appendTo(cell);
                    },
                }, {
                    caption: 'Remark',
                    dataField: 'remark',
                }],
                remoteOperations: false,
                showBorders: true,
            });
        });

        //...

        function DownloadAttachment(attach_id) {
            $("#hdn_AttachId").val(attach_id);
            $("#form_Download").submit();
        }
    </script>
}

General.cshtml.cs

public class GeneralModel : PageModel
{
    //...

    public IActionResult OnPostDownloadAttachment(int order_id, int attach_id)
    {
        (byte[] bytes, string contentType, string filename) = _attachmentManager.DownloadFile(order_id, attach_id)!;
        return File(bytes, contentType, filename);
    }
}

Solution

  • OK. I just found a mistake on my code. It seems that form doesn't allow closing tag with /> (which I did on form_update). So after I changed to use </form> instead, now it works properly.

    <form id="form_update" method="post"></form>