Sneha K

1.2k
527
195.2k

How to stop page Reloading in mvc4 using j -query?

Feb 12 2016 6:10 AM

Hi how to stop the page reload when the button is click. That is

CustomerView

In my CustomerView I have Field called Area and near to area i have created one add button. suppose i enter the customer details and select the area the area is not in the dropdown list . so i need to add the area . so i click the add button . it redirect to the area Partial view from Customer view. I had create one Area Partial VIew for the Area field.

Area Partial view

if i click the add button near to Area it redirect to Area PartialView (LocalHost/Customer/AreaPartialView). In Area Partial view i enter the values and click the Create button it save the data in DB and also it redirect to same customer view . Now My Issue is I enter the CustomerName ,Street,Location, Place, Alias and then only i select the area . Now the area is not listed in the Dropdown means i need to add it so i click that add button near to area. it redirect to area Partial view and i enter the values and click the create button. When i click the create button from area Partial view it redirect to Same Customer view at the same time page get reloaded. so my data all are lost which i enter in the CustomerName ,Street,Location, Place, Alias, so i have to enter the details again . This is my issue . I don't want to page gets reloaded when it redirect from Partial view to CutomerView

My CustomerViewCode

@model Sample_Customer.Models.CustomerViewModel

ViewBag.Title = "Create";

<h2>Customer Form</h2>

</div>

}

<h2>Create</h2>

@using (Html.BeginForm()) {

@Html.AntiForgeryToken()

@Html.ValidationSummary(true)

@Html.LabelFor(model => model.CustomerName, new { @class = "control-label" })

@Html.TextBoxFor(model => model.CustomerName , new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.CustomerName)

</div>

@Html.LabelFor(model => model.Alias )

@Html.DropDownList("SalutationID",null, "Select", new { @class = "form-control" })

@Html.ValidationMessageFor(model => model.Alias)

</div>

@Html.LabelFor(model => model.CustomerType)

@Html.DropDownList("CustomerTypeID",null, "Select", new { @class = "form-control" })

</div>

@Html.LabelFor(model => model.AddressTypeID,"AddressType")

@Html.DropDownList("AddressTypeID",null, "Select", new { @class = "form-control" })

</div>

@Html.LabelFor(model => model.Street,new { @class = "control-label" })

@Html.TextBoxFor(model => model.Street, new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.Street)

</div>

@Html.LabelFor(model => model.Location,new { @class = "control-label" })

@Html.TextBoxFor(model => model.Location, new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.Location)

</div>

@Html.LabelFor(model => model.Place,new { @class = "control-label" })

@Html.TextBoxFor(model => model.Place, new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.Place)

</div>

@Html.LabelFor(model => model.Area)

@Html.DropDownList("AreaID",null, "Select", new { @class = "form-control" })

</div>

My PartialViewCode

@model Sample_Customer.Area

ViewBag.Title = "Create";

}

@using (Html.BeginForm()) {

@Html.AntiForgeryToken()

@Html.ValidationSummary(true)

<legend>Customer</legend>

@Html.LabelFor(model => model.DisplayName, new { @class = "control-label" })

@Html.TextBoxFor(model => model.DisplayName , new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.DisplayName)

</div>

@Html.LabelFor(model => model.PrintName, new { @class = "control-label" })

@Html.TextBoxFor(model => model.PrintName , new { @class = "form-control", type = "text" })

@Html.ValidationMessageFor(model => model.PrintName)

</div>

@Html.Label("City")

@Html.DropDownList("CityID", "Select")

</div>

<p>

</p>

</fieldset>

}

@section Scripts {

@Scripts.Render("~/bundles/jqueryval")

$("#btncreate").click(function () {

$.ajax({

url: "Customer/Create",

type: "get",

data: $("#Customer").serialize(),

//if you need to post Model data, use this

success: function (result) {

$("#ShowPartailView").html(result);

}

});

</script>

}

Actually I did mistake in J query but i cant find that mistake . and i donno what i have to put in data: $("#?").serialize(),

MyControllerCode

public PartialViewResult ShowPartailView()

{

ViewBag.CityID = new SelectList(db.Cities, "CityID", "DisplayName");

return PartialView("ShowPartailView");

}

[HttpPost]

public ActionResult ShowPartailView(Area area)

{

ViewBag.CityID = new SelectList(db.Cities, "CityID", "DisplayName");

if (ModelState.IsValid)

{

area.AreaID = Guid.NewGuid();

area.IsActive = true;

area.IsDeleted = false;

area.CreatedDate = DateTime.Now;

area.EditedDate = DateTime.Now;

area.LastActiveOn = DateTime.Now;

area.RowID = Guid.NewGuid();

area.CreatedSessionID = Guid.NewGuid();

area.EditedSessionID = Guid.NewGuid();

area.OfflineMode = false;

area.OfflineID = Guid.NewGuid();

db.Areas.Add(area);

db.SaveChanges();

};

//return RedirectToAction(Customer,"Create");

return RedirectToAction("Create", "Customer");

}

So any one please have a look and correct my code . And please tell me have to put any reference file for this jquery coding or not..

Advance Thanks.....

Answers (1)

I am trying to hash my password and then trying to store it

error in server application