After i enter the details and click the create button it will save the data in db and it shows the same popup window when it was close means when i click x mark[which is in the pop up window right top corner ) . Now all are working fine.
Now my issue is i open the pop-up window by clicking the button and add the area and close the pop-up window before clicking the main save button in parent view i have to add another one area so i click the add button again but it wont opening the pop-up window . This is my issue.
My Controller code to save the data which is entered in the partial view pop-up window
public ActionResult AreaPartialView()
{
ViewBag.CityID = new SelectList(db.Cities, "CityID", "DisplayName");
return View("AreaPartialView");
}
[HttpPost]
public ActionResult AddAreaInfo(CustomerViewModel objareaVM)
{
var objAreaID = Guid.NewGuid();
ViewBag.CityID = new SelectList(db.Cities, "CityID", "DisplayName", objareaVM.CityID);
var ObjArea = new Area()
{
AreaID =objAreaID,
DisplayName = objareaVM.Area,
PrintName = objareaVM.Area,
CityID = objareaVM.CityID,
IsActive = true,
IsDeleted = false,
CreatedDate = DateTime.Now,
EditedDate = DateTime.Now,
LastActiveOn = DateTime.Now,
RowID = Guid.NewGuid(),
CreatedSessionID = Guid.NewGuid(),
EditedSessionID = Guid.NewGuid(),
OfflineMode = false,
OfflineID = Guid.NewGuid()
};
db.Areas.Add(ObjArea);
db.SaveChanges();
ModelState.Clear();
return Json(objAreaID);
}
My j-query code to display the area partial view as popup window once the add button is clicked in Parent View
<script src="~/Scripts/jquery-1.10.2-ui.js"></script>
<link rel="stylesheet"href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script type="text/javascript">
$("#AddArea").click(function () {
$('#AddAreaNew').dialog("open");
});
$(function () {
$('#AddAreaNew').dialog({
autoOpen: false,
width: 400,
height: 500,
resizable: false,
title: 'Add Area',
modal: true,
open: function (event, ui) {
$(this).load("@Url.Action("AreaPartialView", "Customer")");
},
buttons: {
"Close": function () {
$(this).dialog("close");
}
}
});
});
My Partial View code
@Html.Label("Area" , new { @class = "control-label" })
@Html.TextBoxFor(model => model.Area, new { @class = "form-control", type = "text" ,id ="AreaName"})
@Html.ValidationMessageFor(model => model.Area)
@Html.Label("City")
@Html.DropDownList("CityID", null, "Select", new { @class = "form-control " })
<script src="~/Scripts/jquery-1.10.4-ui.min.js"></script>
<link href="~/Content/jquery-ui-1.10.4.custom.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>
<script type="text/javascript">
function SaveArea() {
debugger;
var Area = $("#AreaName").val();
var CityID = $("#CityID").val();
alert(Area);
var AreaAdd = { "Area": '' +Area + '', "CityID": CityID };
$.post("/Customer/AddAreaInfo", AreaAdd, function(data) {
var option = new Option(Area, data);
$('#AreaID').append($(option));
alert("sucess");
window.close();
});
}
This is my issue i cant able to open my pop-up window multiple times.i tried my level best to explain my issue. please any one help me to solve this issue.
Advance thanks..