Javascript 使用FormMethod发回。使用模态

我有一个jQuery数据表，它有一些自定义按钮，当单击时，会调用boostrap模式。模式询问用户是否要停用帐户

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

在我的

示例2

数据表中，单击按钮时，我将帐户的唯一标识符（

pid

）传递给模式：

    $('#example2').on('click', 'tr', function () {
        var oData = oTable.fnGetData(this);
        var pid = oData[0];
        $(".modal-footer #pid").val(pid);
        //alert(pid);
    });

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

我面临的问题是试图在模式中使用以下表单方法发回我的控制器，我如何才能做到这一点：

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

模态：

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

---

在与OP讨论后，发现在submit按钮上具有data Dismission属性会导致表单无法发布

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

波斯特解释了为什么会发生这种情况

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

您可以在表单中添加一个隐藏字段，然后将ID分配给隐藏字段，当您发布到控制器时，该ID将在控制器操作中可用

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

<input type="hidden" name="accountId" id="accountId" val="" />

最后，在控制器中，向控制器操作添加一个名为accountId的参数

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

---

您有什么问题？什么不起作用？如果它是隐藏的，这有关系吗？我在我的示例中显示了它，因为我希望看到填充的数字。我不认为是这样。另外，我的控制器是一个

FormCollection表单

不，这没关系，你只要在发布后在表单中包含该ID即可。如果你有一个FormCollection，那么你就不需要添加参数了。是的，这正是我已经有的，但它不起作用吗？@GarrithGraham我刚刚读了你的编辑，当你点击发布按钮时，你是否正在点击你的控制器动作？可能是。尝试从“提交”按钮中删除“取消数据”属性

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Warning!</h4>
            </div>
            <div class="modal-body">
                <p>Are you sure you want to deactivate this account?</p>
            </div>
            <div class="modal-footer">
                @using (@Html.BeginForm("ProviderActivate", "AdminPanel", FormMethod.Post))
                {
                    <input type="hidden" name="pid" id="pid" value="pid" />
                        <input type="submit" value="Publish" class="btn btn-default" data-dismiss="modal" />
                }
                @*<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>*@
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>