Кнопка отправки не работает внутри @section mvc

У меня есть эта проблема, и я не могу найти решение. Я поместил кнопку отправки внутри @section, чтобы я мог поместить ее в div на странице макета. Но проблема в том, что кнопка отправки не работает, когда внутри раздела.

Вот вид, раздел en и кнопка отправки находятся почти внизу страницы

@{
var vd = new MvcVerkoop.Models.VerkoopsData();
var data = vd.KoperData; }

@using (Html.BeginForm()){
@Html.ValidationSummary(true)

<fieldset>
    <legend>Kies de nodige velden</legend>


    <table class="velden">

        @foreach (string var in data)
        {

            <tr>
                <td>
                    @Html.CheckBox(var)
                    <label for="Naam">@var</label>
                </td>
                <td>
                    @Html.CheckBox("Verplicht" + @var)
                    <label for="Verlpicht">Verplicht veld</label>
                </td>
            </tr>

        }


        <tr>
            <td>
                <div id="input1" class="clonedInput">

                    @Html.TextBox("extra1")
                </div>

            </td>

            <td>
                <div id="inputCheck1" class="clonedInputCheck">
                    @Html.CheckBox("checkVerplicht1")

                    <label for="checkVerplicht1" id="labelVerplicht1">Verplicht veld</label>
                </div>

            </td>
        </tr>

    </table>

    <div>
        <input type="button" id="btnAdd" value="+" />
        <input type="button" id="btnDel" value="-" />
    </div>

    @section Bottom{

        <input id="btnSubmit" type="submit" value="Doorgaan" />
    }

</fieldset>}

Когда кнопка отправки находится за пределами раздела работает нормально.

РЕДАКТИРОВАТЬ: макет кода

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
</head>
<body>
<header>
        <div class="top-menu">

        </div>
</header>
<div id="body">
    <div class="centre-box">
        <div class="centre-banner">
        </div>

        @RenderSection("featured", required: false)
    <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
        <div class="centre-footer">
            @RenderSection("Bottom", false)
        </div>
    </div>

</div>
<footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>© @DateTime.Now.Year Code Express</p>
            </div>
        </div>
    </footer>
</body>
</html>

Кто-нибудь может мне помочь? Спасибо!

1 ответ

Решение

Я могу только предположить, что когда кнопка находится внутри раздела, она отображается вне формы.

Я предполагаю, что вы хотите поместить кнопку внутри раздела, чтобы вы могли поделиться этой кнопкой во многих формах? В этом случае вам придется использовать JavaScript, чтобы перехватить отправку по событию нажатия кнопки, потому что кнопка больше не является частью формы.

Затем вам также придется подключить событие, когда кто-то нажимает на клавишу ввода, чтобы отправить форму.

Я бы просто создал отдельную кнопку для каждой формы, которую вы хотите отправить. Намного меньше хлопот.

Я знаю, что это старая ветка, но у меня была та же проблема, и я подумал, что опубликую решение, чтобы людям не приходилось просматривать другие сообщения, чтобы решить проблему.

В начальной форме установите идентификатор

@using (Html.BeginForm(htmlAttributes:new { id = "mainForm" }))

Затем на кнопке отправки установите для свойства формы значение идентификатора

<input id="btnSubmit" type="submit" value="Doorgaan" form="mainForm" />

Это исправило это для меня.

Другие вопросы по тегам