lemunk lemunk - 1 month ago 17
C# Question

Nop Commerce RenderBootstrapTabHeader Submit

I have the following code in a custom plugin in NopCommerce v3.8.

@using Nop.Web.Framework;
@using Nop.Core;
@using System.Linq;
@using Nop.Web.Framework.UI;
@using Nop.Web.Framework;
@using Nop.Core.Infrastructure;
@model Nop.Plugin.Widgets.PromoSlider.Domain.PromoSliderRecord

@{ Layout = "_AdminLayout.cshtml"; }

<div class="content">
<div class="form-horizontal">
<div id="slider-edit" class="nav-tabs-custom">
<ul class="nav nav-tabs">
@Html.RenderBootstrapTabHeader("Slider", @T("Slider"), true)
@Html.RenderBootstrapTabHeader("Images", @T("Images"))
</ul>
<div class="tab-content">
@Html.RenderBootstrapTabContent("Slider", Sliders(), true)
@Html.RenderBootstrapTabContent("Images", Images(), false)
</div>
</div>
</div>
</div>


@helper Sliders()
{
using (Html.BeginForm())
{
@Html.AntiForgeryToken()

<div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">
<div>
<div class="adminData">@Html.HiddenFor(m => m.PromoSliderId)</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.PromoSliderName)</div>
<div class="col-md-9">
@Html.EditorFor(m => m.PromoSliderName)
@Html.ValidationMessageFor(m => m.PromoSliderName)
</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.IsActive) </div>
<div class="col-md-9">
@Html.EditorFor(m => m.IsActive)
@Html.ValidationMessageFor(m => m.IsActive)
</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.Interval)</div>
<div class="col-md-9">
@Html.EditorFor(m => m.Interval)
@Html.ValidationMessageFor(m => m.Interval)
</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.Wrap)</div>
<div class="col-md-9">
@Html.EditorFor(m => m.Wrap)
@Html.ValidationMessageFor(m => m.Wrap)
</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.PauseOnHover)</div>
<div class="col-md-9">
@Html.EditorFor(m => m.PauseOnHover)
@Html.ValidationMessageFor(m => m.PauseOnHover)
</div>
</div>
<div class="form-group">
<div class="col-md-2">@Html.NopLabelFor(m => m.ZoneName)</div>
<div class="col-md-9">
@Html.DropDownListFor(m => m.ZoneName, new SelectList(
new List<string>() {
"producdivetails_top",
"categorydetails_after_breadcrumb",
"home_page_top"
}))
@Html.ValidationMessageFor(m => m.ZoneName)
</div>

</div>
<div class="pull-right">
<button type="submit" name="save" class="btn bg-blue">
<i class="fa fa-floppy-o"></i>
@T("DERP")
</button>
</div>
</div>
</div>
</div>
}

}

@helper Images()
{
if (Model.PromoSliderId > 0)
{
@Html.Action("ManagePromoImages", new { PromoSliderId = Model.PromoSliderId })
}
else
{
<p>Please create and save a slider first.</p>
}

}


Submit button doesnt fire at all, reason can be found by looking at the generated source.

<div class="content">
<div class="form-horizontal">
<div id="slider-edit" class="nav-tabs-custom">
<ul class="nav nav-tabs">
<li class="active"><a data-tab-name="Slider" data-toggle="tab" href="#Slider">slider</a></li>
<li class=""><a data-tab-name="Images" data-toggle="tab" href="#Images">images</a></li>
</ul>
<div class="tab-content">
<form action="/PromoSlider/CreateUpdatePromoSlider" method="post"></form><div class="tab-pane active" id="Slider"><input name="__RequestVerificationToken" type="hidden" value="uH2GbG4t6n0dDyBs79d6GQZTorBRpgWFCFithR77gSkAUYvPkMecNIwYtkEGyayid97gmdQp-isUUkMq1M7qSpeYOzwLGW-9WtUIxggkBd-0gATnIt5CvfEtUpjqwnl90" /> <div class="panel-group">
<div class="panel panel-default">
<div class="panel-body">
<div>....


As you can see for some mad reason it decideds to create the form, then close it and input all the @helper html code including the submit button, after the form.

My question, Can you still use


@Html.BeginForm


inside of the


@Html.RenderBootstrapTabHeader


Really would like to get this working in 3.8 thanks.

Answer

The only way which I can offer now is to use <form></form> tag with required parameters to create a form inside @helper {}. We have created an appropriate issue to investigate this problem: https://github.com/nopSolutions/nopCommerce/issues/1840