将路由值传递给Html.BeginForm使用javascript

本文关键字:BeginForm 使用 javascript Html 路由 值传 | 更新日期: 2023-09-27 17:52:49

我目前有面板,每个面板都有一个与之相关联的ID,该ID保存在每个面板的data-id属性中。我可以通过JavaScript轻松实现。一个面板,我有一个删除按钮,将删除面板和它的数据库内的入口。一旦这个删除按钮被点击,一个模态就会启动,它带有Html.BeginForm(),它连接到我的控制器上的一个动作。我想知道是否有可能通过JavaScript添加一个小部件ID到路由值?

这是我的模态:

<div class="modal fade" id="deleteWidgetModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Delete widget?</h4><!--add depending on which panel you have clicked-->
        </div>
        <div class="modal-body" id="myModalBody">
            <!--Depending on which panel insert content-->
            @using (Html.BeginForm("DeleteWidgetConfirmed", "Dashboard", FormMethod.Post,))
            {
                @Html.AntiForgeryToken()
                <div class="form-horizontal">
                    Do you wish to delete this widget?
                    <div class="form-group">
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                            <button type="submit" value="DeleteWidgetConfirmed" class="btn btn-danger btn-ok" id="delete-widget">Delete</button>
                        </div>
                    </div>
                </div>
            }
        </div>
    </div>
</div>

,这里是JavaScript:

    /*---------------------------------------------DELETING PANELS-------------------------------------------------*/
$(document).ready(function () {
    $('#columns').on('click', '.glyphicon.glyphicon-trash', function (event) {
        //get id here
        //toggle the modal
        $('#deleteWidgetModal').modal('toggle');
        //pass id to form
    });
});
$(document).ready(function () {
    document.getElementById('#delete-widget').onclick = function (event) {
        event.preventDefault();
        var parentElement = $(this).closest(".col-md-4.column");
        var targetElement = $(this).closest(".panel.panel-default");
        targetElement.remove();
        //parentElement.addClass("expand-panel");
        checkEmptyPanelContainers();
    }
});

将路由值传递给Html.BeginForm使用javascript

Html。BeginForm在javascript和用户交互执行之前被转换为<form>标记。你可以这样修改这个表单

$("form").prop('myattribute', value)