c# - MVC 4 partial view causes page to become unresponsive on submit -

situation: in c#/mvc 4 solution employing view partial view within. view form submit button. partial view div hidden, can displayed if checkbox selected.

issue: if partial view hidden, submit works normally. if partial view not hidden submit causes page become unresponsive, if 1 waits 3 plus minutes or submit works expected.

the code below. thank in advance consideration. novice developer, therefore comments, suggestions , critiques welcome.

code:

model

namespace mymodels {    public class mainmodel    {        public selectlistitem things { get; set;}         public ienumerable<othermodel> morethings { get; set;}    } } 

view //named myview @model mymodels.mainmodel @using mymodels @if (model != null){

    using (html.beginform("myviewname", "mycontrollername", formmethod.post, new { id = "view-form" })) {     @html.labelfor(model => model.things)     @html.dropdownlist("", (selectist)viewbag.things)     @html.validationmessagefor(model => model.field1)      @html.checkboxwithlabel("anameattribute", model.valueattribute.tostring(), "anidattribute", model.valueatttribue ==1, "alabel", "a_toggle_class")      <div class="treeview" style="display: none;">     <fieldset>         <legend>title</legend>     //view causing issues replaces div below     <div id="replaceddiv"></div>     </fieldset>     </div>      <p>         <input type="submit" value="submit" />     </p> } 

}

<script type="text/javascript">     $(document).ready(function () {        $.ajax({            url: "/mycontroller/mypartialview",            contenttype: "application/html; charset=utf-8",            cache: "false",            type: "get",            datatype: "html"        })        .success(function (result) {            $('#replaceddiv").html(result);        })    }); </script> 

partial view

//named _mypartialview @model mymodels.mainmodel @using mymodels  @foreach (var morethings in viewbag.morethings) {     <div id="replaceddiv">     <label>     <input type="checkbox" id=@morethings.id value=@morethings.name />@morethings.name </label>     </div> } 

controller

namespace main.controllers {     public class mycontroller     {        [httpget]        public actionresult index(mainmodel model)        {           return view(model);        }         public actionresult myview()        {            var model = new mainmodel();             return view(model);         }         public actionresult mypartialview(mainmodel model)        {            <othermodel> morethings = blothermodel.getmorethings();            viewbag.morethings = morethings;             return partialview("_mypartialview", promotion);        }         [httppost]        public actionresult myview(formcollection collection)        {           mainmodel model = new mainmodel();            return savemodel(model);        }     } } 

in ajax using:

$('#replaceddiv").html(result); 

but partial view contains <div id="replaceddiv"> generated in loop

replace partial view code :

@foreach (var morethings in viewbag.morethings) {     <label>@morethings.name </label>     <input type="checkbox" id=@morethings.id value=@morethings.name /> } 

and should ok