[英]MVC View-> JavaScript->Controller method->Javascript->Div tag
I have a create,edit,delete application On my Index view i have Button for Edit. 我有一个创建,编辑,删除应用程序。在我的索引视图中,有用于编辑的按钮。 by clicking this button it should open pop up in which all data should be displayed for editing. 通过单击此按钮,它将打开弹出窗口,其中应显示所有数据以进行编辑。
To achieve this i passed ID of that row which is getting Edited. 为了实现这一点,我通过了正在编辑的那一行的ID。 see code below : 参见下面的代码:
<td>
<button type="button" onclick="EditPopup(@item.Id)">Edit</button>
</td>
here i am passing ID to my EditPopup javascript method. 在这里,我正在将ID传递给我的EditPopup javascript方法。 see the method below : 参见下面的方法:
<script type="text/javascript">
$(document).ready(function () {
$("#EditDialog").dialog({
autoOpen: false,
title: 'Title',
width: 'auto',
height: 'auto',
modal: true
});
});
function EditPopup(Get_Id) {
alert(Get_Id) // I am getting correct ID here.
$.ajax({
method: "POST",
url: '@Url.Action("Edit","Home")',
dataType: 'json',
cache: false,
data:{Get_Id}, // tried : {id:Get_Id} , {id:"Get_Id"} not working
success: function (data) {
$('#EditDialog').html(data);
}
});
$("#EditDialog").dialog("open");
}</script>
I am sending value of ID to my Controller method Edit thats why i am using Post method in ajax call. 我正在将ID的值发送到我的Controller方法。这就是为什么我在ajax调用中使用Post方法的原因。 Edit is name of method and Home is name of controller. Edit是方法的名称,Home是控制器的名称。
HomeController Edit methods HomeController编辑方法
[HttpPost]
public JsonResult Edit(int? id)
{
FloorFactor floorFactor = db.FloorFactors.Find(id);
return Json(floorFactor, JsonRequestBehavior.AllowGet);
}
// POST:
[HttpPost]
public ActionResult Edit(int id, FormCollection collection)
{
FloorFactor floorFactor = db.FloorFactors.Find(id);
return View(floorFactor);
}
in few examples i saw that in ajax call they usually use json result method. 在几个示例中,我看到在ajax调用中,它们通常使用json结果方法。 so that is the reason i also used json result method. 所以这就是我也使用json结果方法的原因。
finally Code which is in my index view where i will show pop up result. 最后在我的索引视图中的代码,我将显示弹出结果。
<div id="EditDialog" style="display:none;">
<label> Floor Factor </label>
<br />
<label> Effective From :</label>
So the Whole scenario is : 所以整个场景是:
I send id value on button click event to javascript. 我将按钮点击事件的ID值发送给javascript。
on javascript i make a call to my controller method to get data. 在JavaScript上,我打电话给我的控制器方法来获取数据。
those should pass in EditDialog box of div. 这些应该在div的EditDialog框中传递。
on div block it should display in pop up. 在div块上,它应该显示在弹出窗口中。
Current output : 电流输出
I also want to understand how url field works in ajax call. 我还想了解ajax调用中url字段的工作方式。
if i am getting multiple column results as output of that url how can i collect all output in Data part of ajax call. 如果我将多列结果作为该URL的输出,如何在ajax调用的Data部分中收集所有输出。
please also explain on success what parameters i can pass in function. 还请说明成功后我可以在函数中传递哪些参数。
Thank you for explanation and help. 感谢您的解释和帮助。
Edit : It shows no error on console tab. 编辑:控制台选项卡上没有显示错误。 as shown in this script tab i think it is sending a request as it generates request Id. 如该脚本选项卡所示,我认为它正在发送请求,因为它生成了请求ID。
Try the below changes 尝试以下更改
Action Code : 动作代码:
[HttpPost]
public JsonResult Edit(int? id)
{
FloorFactor floorFactor = db.FloorFactors.Find(id);
return Json(floorFactor, JsonRequestBehavior.AllowGet);
}
View Changes 查看变更
<div id="EditDialog" style="display:none;">
<label> Floor Factor </label> <span id="floorFactor"></span>
<br />
<label> Effective From :</label> <span id="effectiveFrom"></span>
Success method changes 成功方法变更
if(data)
{
// GET VALUES
var floorFactor = data.Property_Having_FloorFactor;
var effectiveFrom = data.Property_Having_EffectiveFrom;
// ASSIGN VALUES
$('#floorFactor').text(floorFactor);
$('#effectiveFrom ').text(effectiveFrom );
// OPEN DIALOG
$("#EditDialog").dialog("open");
}
Hope it will work for you. 希望它对您有用。
Change the Controller
as 将Controller
更改为
[HttpGet]
public JsonResult Edit(int? id)
{
FloorFactor floorFactor = db.FloorFactors.Find(id);
return Json(floorFactor, JsonRequestBehavior.AllowGet);
}
// POST:
[HttpPost]
public ActionResult Edit(int id, FormCollection collection)
{
FloorFactor floorFactor = db.FloorFactors.Find(id);
return View(floorFactor);
}
Change the 'ajax' as 将“ ajax”更改为
$.ajax({
method: "GET",
url: '@Url.Action("Edit","Home")',
dataType: 'json',
cache: false,
data: {id:Get_Id},
success: function (data) {
$('#EditDialog').html(data);
}
});
Note: Code is untested. 注意:代码未经测试。 It should have work for you. 它应该为您工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.