Html.RenderPartial in Asp.Net Mvc 4 doesn't work fine - asp.net-mvc-4

Question

I have view that display Companies' CardView.Every card has add new BankAccount button to display "Add new bank account" modal popup. My view as follow:
#for (int i = 0; i < Model.Companies.Count(); i += 3)
{
<div class="row-fluid">
<div class="span4">
<div class="box corner-all">
<div class="box-header grd-white">
<div class="header-control">
<div>
<ul class="breadcrumb-nav pull-right">
<li class="btn-group">
<a href="#" class="btn btn-small btn-link dropdown-toggle" data-toggle="dropdown">
<i class="icofont-cogs"></i>Controls
<i class="icofont-caret-down"></i>
</a>
<ul class="dropdown-menu">
<li>Add new bankaccount</li>
<li>#Html.ActionLink("Edit", "Edit", Model.Companies.ElementAt(i), new { target = "_blank" })</li>
</ul>
</li>
</ul>
#{Html.RenderPartial("BankCreateModal", new BankAccountCreateViewModel { BankAccount = new Invoice.Model.BankAccount(), TaxTypes = Model.TaxTypes, CompanyID = Model.Companies.ElementAt(i).ID });}
</div>
</div>
<span>#Model.Companies.ElementAt(i).ShortName</span>
</div>
<div class="box-body">
<table>
<tr>
<td rowspan="2">
<div class="resume-photo">
<img src="~/Content/img/LogoFiles/#Model.Companies.ElementAt(i).LogoFile" style="width: 50px; height: 45px;"/>
</div>
</td>
<td>#Model.Companies.ElementAt(i).FullName</td>
</tr>
</table>
<div class="alert alert-info">
#*<button type="button" class="close" data-dismiss="alert">×</button>*#
<strong></strong>#Model.Companies.ElementAt(i).CompanyDescription
</div>
</div>
<div style="text-align: center; padding-left: 22px;">
<div class="thumbnails pricing-table color-black">
<div class="span3 active grd-white box-shadow" style="width: 270px;">
<div class="bank_details_expand">
<div class="features">
<div id="slideshow-area">
<div id="slideshow-previous"></div>
<div id="slideshow-next"></div>
<div id="slideshow-scroller">
<div id="slideshow-holder">
#foreach (var bank in Model.BankAccounts.ElementAt(i))
{
<div class="slideshow-content">
<div class="alert alert-info">
<!--box body-->
<div class="box-body">
<!-- Button to trigger modal -->
<!-- Modal -->
#{Html.RenderPartial("BankEditModal", new BankAccountEditViewModel { BankAccount = bank, TaxTypes = Model.TaxTypes });}
</div>
<!--/box body-->
<ul style="text-align: left;">
<li></li>
<li><span style="font-weight: bolder; color: #0B72E0">Bank Name:</span>
<span style="font-style: italic;">#bank.BankName</span></li>
<li><span style="font-weight: bolder; color: #0B72E0">Corr. Account:</span>
<span style="font-style: italic;">#bank.CorrespondentAccount</span> </li>
<li><span style="font-weight: bolder; color: #0B72E0">IBAN:</span>
<span style="font-style: italic;">#bank.IBAN </span></li>
<li><span style="font-weight: bolder; color: #0B72E0">Code:</span>
<span style="font-style: italic;">#bank.Code</span></li>
<li><span style="font-weight: bolder; color: #0B72E0">SWIFT:</span>
<span style="font-style: italic;">#bank.SWIFT</span></li>
<li><span style="font-weight: bolder; color: #0B72E0">Tax Type:</span>
<span style="font-style: italic;">#bank.Tax.Presentage % </span></li>
</ul>
</div>
</div>
}
</div>
</div>
</div>
</div>
</div>
<div class="bank-details-control">
<div class="footer grd-white" data-box="expandBank">
<div>Bank Details</div>
<i class="icofont-chevron-down"></i>
#*<a class="btn btn-block btn-warning" data-box="expandBank">Bank Details</a>*#
</div>
</div>
</div>
</div>
</div>
</div>
</div>
#if (Model.Companies.Count() - 1 > i)
{
#{Html.RenderPartial("BankCreateModal", new BankAccountCreateViewModel { BankAccount = new Invoice.Model.BankAccount(), TaxTypes = Model.TaxTypes, CompanyID = Model.Companies.ElementAt(i + 1).ID });}
}
#if (Model.Companies.Count() - 2 > i)
{
#{Html.RenderPartial("BankCreateModal", new BankAccountCreateViewModel { BankAccount = new Invoice.Model.BankAccount(), TaxTypes = Model.TaxTypes, CompanyID = Model.Companies.ElementAt(i + 2).ID });}
}
}
PartialView for create bankaccount as follow
#model InvoiceModel.HelperClasses.BankAccountCreateViewModel
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<div id="MyCreate" class="modal hide fade" tabindex="-1" role="dialog" aria- labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 id="myModalLabel">Bank Account</h2>
</div>
<div class="modal-body">
#using (Ajax.BeginForm("CreateModal", new AjaxOptions { UpdateTargetId = "Createmodal", HttpMethod = "Post" }))
{
#Html.ValidationSummary(true)
#Html.HiddenFor(model => model.CompanyID)
#Html.HiddenFor(model => model.TaxTypes)
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.BankName)
#Html.EditorFor(model => model.BankAccount.BankName)
#Html.ValidationMessageFor(model => model.BankAccount.BankName)
</div>
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.CorrespondentAccount)
#Html.EditorFor(model => model.BankAccount.CorrespondentAccount)
#Html.ValidationMessageFor(model => model.BankAccount.CorrespondentAccount)
</div>
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.IBAN)
#Html.EditorFor(model => model.BankAccount.IBAN)
#Html.ValidationMessageFor(model => model.BankAccount.IBAN)
</div>
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.Code)
#Html.EditorFor(model => model.BankAccount.Code)
#Html.ValidationMessageFor(model => model.BankAccount.Code)
</div>
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.SWIFT)
#Html.EditorFor(model => model.BankAccount.SWIFT)
#Html.ValidationMessageFor(model => model.BankAccount.SWIFT)
</div>
<div class="control-group">
#Html.LabelFor(model => model.BankAccount.TaxID, new { #class = "control-label" })
<div class="controls">
#Html.DropDownListFor(model => model.BankAccount.TaxID, new SelectList(Model.TaxTypes, "ID", "Name"), new { data_placeholder = "Select Tax Type", data_form = "select2" })
#Html.ValidationMessageFor(model => model.BankAccount.TaxID)
</div>
</div>
<button class="btn btn-primary">Save changes</button>
}
</div>
<div class="modal-footer">
<button class="btn btn-danger" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
So, When I click SaveChanges button I can create new bank for first company, but when click for other company in bankaccountcontroller my CompanyID is the same with first company. My HTTPPOST action as follow
[HttpPost]
public ActionResult CreateModal(BankAccountCreateViewModel bank)
{
bank.BankAccount.CompanyID = bank.CompanyID;
bankRepository.SaveBankAccount(bank.BankAccount);
return RedirectToActionPermanent("Index");
}
How can I fix this problem? I need second or other companyID, not first.