How to pass date from partial view to controller in MVC4?

Sneha K

10y1.8kLearn iOS Programming

Hi I want to pass the data from partial view to controller

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 " })

My Model(CustomerViewModel)

public Nullable AreaID { get; set; }

public string Area { get; set; }

public Nullable CityID{ get; set; }

public string City { get; set; }

My Controller

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("Customer", JsonRequestBehavior.AllowGet);

}

When i enter the details it get all the values in j query function it getting the value in

var Area = $("#AreaName").val();

var CityID = $("#CityID").val();

and also in

var AreaAdd = { "AreaName": '' + Area + '', "CityID": CityID };

and showing all alert message with values there is no problem in getting the values in j query function . The problem is in passing these values to controller the Area Value will be null but nit CityID. This is my issue . I am facing this issue from long time . please any one help me to resolve this issue..

Advance thanks..

20 Replies

Know the answer? Post it — somebody with the same question will find it here.

Saillesh Pawar10y ago
Accepted answer
Arey make some changes also i wanted you to catch the difference. the problem is the parameter name has been to be same as model properties else model binder will not bind the values. try below view code for your reference.

@model MvcApplication2.Models.CustomerViewModel
@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 " })
0
Sneha K10y ago
Can you explain me the answer briefly
0
Saillesh Pawar10y ago
on the button click event if validation are correct you can add the assigned the value to the textbox area.
0
Sneha K10y ago
This is my Parent View Customer i have one add button near to Area if i enter the CustomerName AddressTypem, street, location and select the area if area is not in the list means i have to add that. so i click that add button it will open AreaPartial view as popup window.

After i enter the details and click the create button it will save the details 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 after i close the popup window using the X mark( which is in the pop up window right top corner) it didn't load the value which i recently added in the area field one i refresh the whole customer view and click the Area field the value is loaded. This is my issue when i close the popup window the value which i recently added have to load automatically in the Area Field of Customer Parent view

Area Partial view pop-up window whole 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 " })

Now how i do this task. help to resolve this task..

Advance thanks..

0
Sneha K10y ago
wait i will explain my issue with some images
0
Saillesh Pawar10y ago
Just tell me once the area gets saved you want area to be shown in main parent view?
0
Sneha K10y ago
Saillesh you tell me one code right to pass the data to controller that code is for popup window only. so as per you said i have to change this below code to ajax ?? 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) { if (data == 0) { location = location.href; } }, 'json').success(function (data) { alert("sucess"); window.close(); }); } this code i wrote in AreaPartial view.
0
Saillesh Pawar10y ago
Try to make ajax call on close event and load the values form the db to the dropdown.
0
Sneha K10y ago
Saillesh i have one view called Customer.In that view i have one field called Area. I kept one add button near to area. suppose if area is not in the list means i click that add button it open AreaPartialView as popup window.

And if i enter the details and click the save button the values also saved in DB. After i close the popup window the values will not be loaded in that Area field dropdown after refresh the whole parent page value will be load in the Dropdown. This is the issue when i close the popup window the value have to load automatically in that particular area field. if you want code means im ready to post my code too.
0
Sneha K10y ago
ok wait i will post my doubt as reply . give me 5 mins it is big one
0
Saillesh Pawar10y ago
yeah sure i will be happy if i am able to answer it
0
Sneha K10y ago
Saillesh thanks alot this isue got cleared i have one another doubt in this same task shall i ask that...
0
Sneha K10y ago
Ok Saillesh let i have a try
0
Sneha K10y ago
But Saillesh i gave the Area Id value as AreaName . And I tried the Same Code which you mention while using your code the j query itself didn't get the value the value of $('#Area').val will be null but when i use $('#AreaName').val it getting the value but while passing this value to controller it will be null..
0
Saillesh Pawar10y ago
These are not same
Yours
var AreaAdd = { "AreaName": '' + Area + '', "CityID": CityID };
Mine
var AreaAdd = { "Area": '' + Area + '', "CityID": CityID };
test it plz
0
Sneha K10y ago
Saillesh the issue is not getting the value my above code is working perfectly to getting the values i tried the same code as per you said see my above code but my issue is while passing the Area and City ID value to controller the City value is Successfully passed but the Area value will be null This is the issue. :( :(
0
Saillesh Pawar10y ago
Sorry for that this will help
var AreaAdd = { "Area": '' + Area + '', "CityID": CityID };
0
Sneha K10y ago
Saillesh pawar im getting that value fropm Db and the datatype of CityID is GUID and the main issue is not in CityID it is in Area . it pass the City ID value But it didnt pass the Area Value that is my issue
0
Saillesh Pawar10y ago
I don't understand why are you taking property as
public Nullable CityID{ get; set; }
rather declare property as

public int? CityID { get; set; }
Your problem will be resolved
0
Pradeep Sahoo10y ago
As you are changing by client side , its changed value are not reflected in model . so use Ajax call and pass the parameter to the controller using ajax calls.
0