[Solved] why form in tab page be pulled out when render in browser?

[Nick Wu]

I put a form in the first tab page of Tabstrip. When the view be rendered in browser, I found the form tag be pulled out ,but the content that define in the form was still in tab page . This cause a problem that I can't submit it.

@(Html.Telerik().TabStrip()

    .Name("tTabQuotations")

    .Items(tabs =>

    {       

        tabs.Add().Text("Summary").Content(

         @<div id="divSummary">

             @using (Html.BeginForm("Edit", "Quotation", new { id = Model.QuotationID }))

             {

                    // Content in the form.

             }

         </div>

       );

      // other tab pages.

   })

)

below is the html that rendered in browser.

<form  method="post" action="/Quotation/Edit/1"></form>   <---- the form be pulled out !
<div id="tTabQuotations" class="t-widget t-tabstrip t-header">
<ul class="t-reset t-tabstrip-items"> ... <ul>
<div id="tTabQuotations-1" class="t-content t-state-active" style="display:block">
<div id="divSummary">
   //Content in the form
</div>
//etc....

why?  my version is 2011.1.419.

[Atanas Korchev]

Hi Nick Wu,

This is a quirk of the way ASP.NET MVC form are rendered and Razor. Forms are immediately rendered upon declaration.

Use the following syntax to get it right (Note that @() changed to @ {} and that Render(); is called):

@{
  Html.Telerik().TabStrip()

    .Name("tTabQuotations")

    .Items(tabs =>

    {       

        tabs.Add().Text("Summary").Content(

         @<div id="divSummary">

             @using (Html.BeginForm("Edit", "Quotation", new { id = Model.QuotationID }))

             {

                    // Content in the form.

             }

         </div>

       );

      // other tab pages.

   }).Render();
}

Kind regards,
Atanas Korchev
the Telerik team