我正在开发一个使用ASP.NET MVC 5的简单应用程序。我在尝试将json转换为实体时遇到了问题。
这是我的代码:
实体
public class PlayListViewModel
{
public PlayListViewModel() {
Tracks = new List<Track>();
}
public PlayListViewModel(Dominio.Playlist playList)
{
this.Id= playList.Id;
this.Nombre = playList.Name;
}
public int Id { get; set; }
public string Nombre { get; set; }
public int Calificacion { get; set; }
public List<Track> Tracks { get; set; }
public class Track
{
public int Id { get; set; }
}
}
HTML
@model MyTunes.Models.PlayListViewModel
<div class="form-horizontal">
<h4>Playlist</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.Nombre, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Nombre, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Nombre, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2">Track</label>
<div class="col-md-4">
<input type="hidden" id="hdn-track-id" />
<input type="text" id="input-track" class="form-control" />
</div>
<div class="col-md-6">
<input type="button" value="Agregar Track" class="btn btn-default" id="add-track" />
</div>
</div>
<table class="table" id="tb_track">
<tr>
<th>Lista de Tracks</th>
<th></th>
</tr>
</table>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" id="create-playlist" value="Create" class="btn btn-default" />
</div>
</div>
</div>
的JavaScript
$("#create-playlist").on('click', function () {
var playlist = {
Id : '1',
Calificacion : '2',
Nombre : $("#Nombre").val(),
Tracks: []
};
$("td[data-pick='1']").each(function () {
var idTrack = $(this).attr("data-id");
playlist.Tracks.push({ Id: idTrack });
});
//function PlayListModel() {
// var self = this;
// self.Nombre = $("#Nombre").val();
// self.tracks = [];
//}
$.ajax(
{
url: "/Playlist/Create",
type: "POST",
data: JSON.stringify(playlist),
success: function (data) {
$(".result").html(data);
},
dataType: "json",
contentType: "application/json" //"application/json; charset=utf-8"
});
});
控制器
[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult Create(PlayListViewModel playlist)
{
if (ModelState.IsValid)
{
//Of course I have to add some code here
}
// If we got this far, something failed, redisplay form
return Json(true);
}
当我运行它时,只有字段“Nombre”被映射为“播放列表”对象的一部分,该对象作为“创建”动作的参数被接收。
我对字段“Id”和“Calificacion”进行了硬编码,但它没有正确绑定(只显示0,因为它们是整数)。此外,还有一个应绑定的曲目列表,但它们也不绑定。
我尝试将JSON作为对象传递,并使用JSON.stringify方法但是没有运气。
任何帮助都将非常感激(如果您更喜欢运行代码,可以从这里下载https://github.com/lbendezu/myTunesLux - 访问myTunesLux / MyTunes / DbScripts以获取数据库)
答案 0 :(得分:0)
我的错误,输入#create-playlist是一个提交,在JavaScript中我试图调用click事件。尽管如此,提交事件被调用,这就是为什么它绑定不正确。现在我将输入类型更改为&#34;按钮&#34;它工作正常。