ASP.Net Mvc 如何使用按钮将数据从视图传递到控制器 Ajax
ASP.Net Mvc How to pass data from View into Controller with a Button using Ajax
我有一个按钮可以从模型中获取数据并将其传递给 Ajax 函数。
然后此函数应该调用控制器,但它没有调用,控制器上的断点永远不会命中。
从模型中获取参数的按钮(均为字符串):
<button class="btn btn-primary btn-lg active" onclick="PassHwData(@obj.Name,@obj.HomeWorldBonus)" >Choose @obj.Name</button>
Ajax函数:
<script>
function PassHwData(name, hwBonus)
{
$.ajax({
url: '@Url.Action("Create", "HomeWorld")',
type: "POST",
data: {'name' : name, 'hwBonus' : hwBonus}
datatype: "text",
success: function(name, hwBonus)
{
document.getElementById('success').innerHTML += success {name}{hwBonus};
}
})
}
</script>
<div id=success>
success:
</div>
Controller(还有其他方法,这里省略):
using DarkHeresy.Application.Services.Interfaces;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
namespace DarkHeresy.Web.Controllers
{
[Authorize]
public class HomeWorldController : Controller
{
private readonly IHomeWorldService _homeWorldService;
public HomeWorldController(IHomeWorldService homeWorldService)
{
_homeWorldService = homeWorldService;
}
[HttpPost]
public async Task<IActionResult> Create(string name, string hwBonus)
{
return View(await _homeWorldService.UpdateCharacterList()); //this will have implementation later
}
}
}
我还应该补充一点,我正在使用 Asp.Net Core MVC 并使用 Clean Architecture,并且在这两方面都是超级新手。
您可以使用这种替代方法通过 AJAX
将数据发送到您的 Controller
方法:
HTML:
<button class="btn btn-primary btn-lg active" onclick="PassHwData('@obj.Name','@obj.HomeWorldBonus')" >Choose @obj.Name</button>
AJAX:
<script>
function PassHwData(name, hwBonus)
{
console.log(name);
console.log(hwBonus);
var json = {
name : name,
hwBonus : hwBonus
};
$.ajax({
type: "POST",
url: "@Url.Action("Create", "HomeWorld")",
dataType: "json",
data: {"json": JSON.stringify(json)},
success: function(name, hwBonus)
{
document.getElementById('success').innerHTML += success {name}{hwBonus};
}
})
}
</script>
<div id="success">
success:
</div>
控制器方法:
using DarkHeresy.Application.Services.Interfaces;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using System.Text.Json; //For .NET CORE
namespace DarkHeresy.Web.Controllers
{
[Authorize]
public class HomeWorldController : Controller
{
private readonly IHomeWorldService _homeWorldService;
public HomeWorldController(IHomeWorldService homeWorldService)
{
_homeWorldService = homeWorldService;
}
[HttpPost]
public async Task<IActionResult> Create(string json)
{
var jsondata = JsonSerializer.Deserialize<dynamic>(json);
//Get your variables here from AJAX call
var name = jsondata["name"];
var hwBonus = jsondata["hwBonus"];
return View(await _homeWorldService.UpdateCharacterList()); //this will have implementation later
}
}
}
将 ajax 的数据类型更改为 'json'
我有一个按钮可以从模型中获取数据并将其传递给 Ajax 函数。 然后此函数应该调用控制器,但它没有调用,控制器上的断点永远不会命中。
从模型中获取参数的按钮(均为字符串):
<button class="btn btn-primary btn-lg active" onclick="PassHwData(@obj.Name,@obj.HomeWorldBonus)" >Choose @obj.Name</button>
Ajax函数:
<script>
function PassHwData(name, hwBonus)
{
$.ajax({
url: '@Url.Action("Create", "HomeWorld")',
type: "POST",
data: {'name' : name, 'hwBonus' : hwBonus}
datatype: "text",
success: function(name, hwBonus)
{
document.getElementById('success').innerHTML += success {name}{hwBonus};
}
})
}
</script>
<div id=success>
success:
</div>
Controller(还有其他方法,这里省略):
using DarkHeresy.Application.Services.Interfaces;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
namespace DarkHeresy.Web.Controllers
{
[Authorize]
public class HomeWorldController : Controller
{
private readonly IHomeWorldService _homeWorldService;
public HomeWorldController(IHomeWorldService homeWorldService)
{
_homeWorldService = homeWorldService;
}
[HttpPost]
public async Task<IActionResult> Create(string name, string hwBonus)
{
return View(await _homeWorldService.UpdateCharacterList()); //this will have implementation later
}
}
}
我还应该补充一点,我正在使用 Asp.Net Core MVC 并使用 Clean Architecture,并且在这两方面都是超级新手。
您可以使用这种替代方法通过 AJAX
将数据发送到您的 Controller
方法:
HTML:
<button class="btn btn-primary btn-lg active" onclick="PassHwData('@obj.Name','@obj.HomeWorldBonus')" >Choose @obj.Name</button>
AJAX:
<script>
function PassHwData(name, hwBonus)
{
console.log(name);
console.log(hwBonus);
var json = {
name : name,
hwBonus : hwBonus
};
$.ajax({
type: "POST",
url: "@Url.Action("Create", "HomeWorld")",
dataType: "json",
data: {"json": JSON.stringify(json)},
success: function(name, hwBonus)
{
document.getElementById('success').innerHTML += success {name}{hwBonus};
}
})
}
</script>
<div id="success">
success:
</div>
控制器方法:
using DarkHeresy.Application.Services.Interfaces;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using System.Text.Json; //For .NET CORE
namespace DarkHeresy.Web.Controllers
{
[Authorize]
public class HomeWorldController : Controller
{
private readonly IHomeWorldService _homeWorldService;
public HomeWorldController(IHomeWorldService homeWorldService)
{
_homeWorldService = homeWorldService;
}
[HttpPost]
public async Task<IActionResult> Create(string json)
{
var jsondata = JsonSerializer.Deserialize<dynamic>(json);
//Get your variables here from AJAX call
var name = jsondata["name"];
var hwBonus = jsondata["hwBonus"];
return View(await _homeWorldService.UpdateCharacterList()); //this will have implementation later
}
}
}
将 ajax 的数据类型更改为 'json'