如何通过Ajax在MVC3中插入数据？ [英] How to Insert Data Via Ajax In MVC3?
问题描述
大家好，
我正在编写一个类似博客的新项目。简单来说，有一个帖子和评论部分。我通过发布页面添加评论。这个'刷新'页面。
这对用户不利。无需刷新页面。
我擅长Mvc和C＃。但是，我对Ajax和JS有一点了解。
我做了研究并做了一些事情。但是，它根本不起作用。让我来代表。
查看;
<前lang =HTML> < section class = panel-footer pb0 >
< script 类型 = text / javascript >
$（ ＃commentCreate）。click（ function （e）{
e.preventDefault（）;
alert（ 这里）;
var comment = getComment（）;
Console.dir（评论）;
if （comment == null ）{
alert（ 请指定名称！）;
return ;
}
var json = JSON .stringify（comment） ;
function getComment（）{
var commentText = $（ ＃CommentText）。val（）;
var nameSurname = $（ ＃NameSurname ）VAL（）;
var email = $（ #Electrail ）VAL（）;
return （namesurname == ）？ null ：{CommentText：commentText，NameSurname：namesurname，EMail：email};
$ .ajax（{
url：' / Blog / Comment'，
类型：' POST'，
dataType：' json'，
data：json，
contentType：' application / json; charset = utf-8'，
成功： function （data）{
console .log（data）;
$ .each（data， function （i，obj）{
$（ ＃resultMessage）HTML（obj.CommentText）;
}）;
}
}）; }
}）;
< / script >
< h4 class = mt0 mb15 text-primary > Yorum Yap < / h4 >
< 表格 id = deneme class = form-horizontal 方法 = post >
< div class = form-group >
< 标签 class = col-sm-3 control-label > 名称< span class = text-danger > * < / span > < / label >
< div class = col-sm-9 < span class =code-keyword>>
< input type = text 名称 = 名称 id = 名称 class = form-control >
< / div >
< / div >
< div class = form-group > ;
< label class = col-sm-3 control-label > 电子邮件< span class = text-danger > * < / span > < / label < span class =code-keyword>>
< div class = col-sm-9 >
< 输入 type = text 名称 = 电子邮件 id < span class =code-keyword> = 电子邮件 class = form-control >
< / div >
< / div >
< div class = form-group >
< label class = col-sm-3 control-label > 评论< / label >
< div class = col-sm-9 >
< textarea class = form-control 行 = 6 id = CommentText name = CommentText > < / textarea >
< / div >
< / div >
< div class = form-group >
< div class = col-sm-12 >
< 按钮 类型 = 重置 class = btn btn-default > 重置< / button >
< 按钮 type = < span class =code-keyword> submit class = btn btn-success id = commentCreate onclick = commentCreate（） > < span class = ladda-label > 评论< / span < span class =code-keyword>> < / button >
< / div < span class =code-keyword>>
< / div >
< / form >
< / section >
在控制器中
[HttpPost]
public ActionResult Comment（Comment inputModel）
{
if （ModelState.IsValid）
{
// Insert To DB
return Json（ new 评论{CommentText = Smthng ???}）;
}
else
{
string errorMessage = < div class = \validation-summary-errors \>发生以下错误：< UL>中;
foreach （ var key in ModelState.Keys）
{
var error = ModelState [key] .Errors.FirstOrDefault（）;
if （错误！= null ）
{
errorMessage + = < li class = \field-validation-error \> + error.ErrorMessage + < / li>;
}
}
errorMessage + = < / ul>;
return Json（ new Comment {CommentText = errorMessage}）;
}
}
我的代码有什么问题？我该怎么办？我想做的事情是如此简单，但是，如果你没有足够的知识;它成为全世界最困难的事情。
谢谢。
（ ＃commentCreate）。click（ function （ e）{
e.preventDefault（）;
alert（ Here ）;
var comment = getComment（）;
Console.dir（comment）;
if （comment == null ）{
alert（ 请指定名称！）;
返回;
}
var json = JSON .stringify（comment） ;
function getComment（）{
var commentText =
（ ＃CommentText）。val（）;
var nameSurname =
（ ＃NameSurname）VAL（）;
var email =
Hello everyone,
I am coding a new project which is something like blog. Simply, there is a post and a comment section. I am adding comment by posting the page. And this 'refresh' the page.
That is not good for the users. No need to refresh the page.
I am good at Mvc and C#. However, I have a little knowledge on Ajax and JS.
I made research and did some stuff. However, it does not work at all. Let me represent.
In View;
<section class="panel-footer pb0">
<script type="text/javascript">
$("#commentCreate").click(function (e) {
e.preventDefault();
alert("Here");
var comment = getComment();
Console.dir(comment);
if (comment == null) {
alert("Specify a name please!");
return;
}
var json = JSON.stringify(comment);
function getComment() {
var commentText = $("#CommentText").val();
var nameSurname = $("#NameSurname").val();
var email = $("#EMail").val();
return (namesurname == "") ? null : { CommentText: commentText, NameSurname: namesurname, EMail: email };
$.ajax({
url: '/Blog/Comment',
type: 'POST',
dataType: 'json',
data: json,
contentType: 'application/json; charset=utf-8',
success: function (data) {
console.log(data);
$.each(data, function (i, obj) {
$("#resultMessage").html(obj.CommentText);
});
}
}); }
});
</script>
<h4 class="mt0 mb15 text-primary">Yorum Yap</h4>
<form id="deneme" class="form-horizontal" method="post" >
<div class="form-group">
<label class="col-sm-3 control-label">Name <span class="text-danger">*</span></label>
<div class="col-sm-9">
<input type="text" name="Name" id="Name" class="form-control" >
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">Email <span class="text-danger">*</span></label>
<div class="col-sm-9">
<input type="text" name="EMail" id="EMail" class="form-control" >
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">Comment</label>
<div class="col-sm-9">
<textarea class="form-control" rows="6" id="CommentText" name="CommentText"></textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button type="reset" class="btn btn-default">Reset</button>
<button type="submit" class="btn btn-success" id="commentCreate" onclick="commentCreate()" ><span class="ladda-label">Comment</span></button>
</div>
</div>
</form>
</section>
In Controller
[HttpPost]
public ActionResult Comment(Comment inputModel)
{
if (ModelState.IsValid)
{
//Insert To DB
return Json(new Comment { CommentText = "Smthng???" });
}
else
{
string errorMessage = "<div class=\"validation-summary-errors\">The following errors occurred:<ul>";
foreach (var key in ModelState.Keys)
{
var error = ModelState[key].Errors.FirstOrDefault();
if (error != null)
{
errorMessage += "<li class=\"field-validation-error\">" + error.ErrorMessage + "</li>";
}
}
errorMessage += "</ul>";
return Json(new Comment { CommentText = errorMessage });
}
}
What is wrong with my code? What should I do? The thing that I am trying to do, is so simple but, if you don' t have enough knowledge; it becomes the most difficult thing all over the world.
Thank you.
("#commentCreate").click(function (e) { e.preventDefault(); alert("Here"); var comment = getComment(); Console.dir(comment); if (comment == null) { alert("Specify a name please!"); return; } var json = JSON.stringify(comment); function getComment() { var commentText =
("#CommentText").val(); var nameSurname =
("#NameSurname").val(); var email =
这篇关于如何通过Ajax在MVC3中插入数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
