I have dropdown changed event but I keep losing the viewmodel data. I have search google and can't quite find an answer that relates to this problem
How can I keep the Typed in data so that on every PostBack(dropdown onchanged event) I can repopulate the form so that the user doesn't have to keep typing in e.g. password on every post back
I have 2 onchanged events that needs to be called so that the correct data gets populated into the next drop down...That works fine but keeping the typed in data in my viewmodel goes away
I have tried a lot of things but can't seem to figure this one out.
here is the form
@using (Html.BeginForm("RegisterCompany", "Master", FormMethod.Post, new { @class = "form-horizontal" }))
{
<div class="panel panel-default">
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Company Name:</label>
<div class="col-md-9 col-xs-7">
@Html.TextBoxFor(x => x.Name, new { type = "text", @class = "form-control" })
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Password:</label>
<div class="col-md-9 col-xs-7">
<div class="input-group">
<span class="input-group-addon"><span class="fa fa-unlock-alt"></span></span>
@Html.PasswordFor(x => x.Password, new { type = "password", @class = "form-control" })
</div>
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Country:</label>
<div class="col-md-9 col-xs-7">
@Html.DropDownListFor(x => x.CountryId, (IEnumerable<SelectListItem>)ViewBag.CountryItems, "Please Select", new { @class = "form-control select", @onchange = "CallChangefunc(null)" })
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Province:</label>
<div class="col-md-9 col-xs-7">
@Html.DropDownListFor(x => x.ProvinceId, (IEnumerable<SelectListItem>)ViewBag.ProvinceItems, "Please Select", new { @class = "form-control select", @onchange = "CallChangefunc(this.value)" })
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">City:</label>
<div class="col-md-9 col-xs-7">
@Html.DropDownListFor(x => x.CityId, (IEnumerable<SelectListItem>)ViewBag.CityItems, "Please Select", new { @class = "form-control select" })
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Are you a supplier:</label>
<div class="col-md-9 col-xs-7">
@Html.CheckBoxFor(x => x.IsSupplier, new { type = "checkbox", @class = "icheckbox" })
</div>
</div>
<div class="form-group">
<label class="col-md-3 col-xs-5 control-label">Company Logo:</label>
<div class="col-md-9 col-xs-7">
<input type="file" class="fileinput btn-primary" name="filename" id="filename" title="Browse file" />
</div>
</div>
<div class="form-group">
<div class="col-md-12 col-xs-5">
<button class="btn btn-primary btn-rounded pull-left">Back</button>
<button class="btn btn-primary btn-rounded pull-right">Register</button>
</div>
</div>
</div>
</div>
}
</div>
</div>
<script type="text/javascript" src="../../Scripts/js/plugins.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/jquery/jquery-ui.min.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/mcustomscrollbar/jquery.mCustomScrollbar.min.js"></script>
<script type='text/javascript' src='../../Scripts/js/plugins/icheck/icheck.min.js'></script>
<script type="text/javascript" src="../../Scripts/js/plugins/bootstrap/bootstrap-file-input.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/bootstrap/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/bootstrap/bootstrap-select.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins/tagsinput/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="../../Scripts/js/settings.js"></script>
<script type="text/javascript" src="../../Scripts/js/plugins.js"></script>
<script type="text/javascript" src="../../Scripts/js/actions.js"></script>
<script type='text/javascript' src='../../js/plugins/noty/jquery.noty.js'></script>
<script type='text/javascript' src='../../js/plugins/noty/layouts/topCenter.js'></script>
<script type='text/javascript' src='../../js/plugins/noty/layouts/topLeft.js'></script>
<script type='text/javascript' src='../../js/plugins/noty/layouts/topRight.js'></script>
<script type='text/javascript' src='../../js/plugins/noty/themes/default.js'></script>
<script>
function CallChangefunc(provinceId) {
var countries = document.getElementById("CountryId");
var countryId = countries.options[countries.selectedIndex].value;
window.location.href = "/Master/SetDropDowns?provinceId=" + provinceId + "&countryId=" + countryId;
}
</script>
Here is the Action Result
[HttpGet]
public ActionResult SetDropDowns(string provinceId, string countryId)
{
if(TempData["RegisterVM"] == null)
TempData["RegisterVM"] = new RegisterVM();
var registerVM = TempData["RegisterVM"] as RegisterVM;
if (!string.IsNullOrEmpty(provinceId) && provinceId != "null")
registerVM.ProvinceId = Convert.ToInt32(provinceId);
if (!string.IsNullOrEmpty(countryId) && countryId != "null")
registerVM.CountryId = Convert.ToInt32(countryId);
IEnumerable<SelectListItem> CountryItems = BusinessAPI.CountryManager.GetAllCountries().Select(ci => new SelectListItem
{
Value = ci.Id.ToString(),
Text = ci.Name
});
ViewBag.CountryItems = CountryItems;
IEnumerable<SelectListItem> ProvinceItems = BusinessAPI.ProvinceManager.GetAllProvincesByCountryId(registerVM.CountryId).Select(ci => new SelectListItem
{
Value = ci.Id.ToString(),
Text = ci.Name
});
ViewBag.ProvinceItems = ProvinceItems;
IEnumerable<SelectListItem> CityItems = BusinessAPI.CityManager.GetAllCitiesByProvinceId(registerVM.ProvinceId).Select(ci => new SelectListItem
{
Value = ci.Id.ToString(),
Text = ci.Name
});
ViewBag.CityItems = CityItems;
return View("Register");
}
