use*_*923 5 asp.net asp.net-mvc ckeditor
学习mvc,我正在尝试实现一个包含3个字段的页面Name-Surname-Description所以在我的学习示例中,我正在加载员工,我应该能够创建和编辑它们.
描述应该使用CKEditor.
但是我似乎无法保存描述,例如用户在描述字段中输入的内容.我在网上看到的例子很少,但没有一个下载的解决方案,因为我似乎无法整理.我发现这个人有一个很酷的html助手,但似乎无法将一个例子放在一起 http://www.andrewbarber.com/post/CKEditor-Html-Helpers-ASPNET-MVC-Razor-Views.aspx
问题是:
我做了所有的管道如下:
Create.chtml
@model MvcApplicationCKEditorIntegration.Models.EmployeeViewModel
@{
ViewBag.Title = "Create";
}
<h2>
Create</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<fieldset>
<legend>EmployeeViewModel</legend>
<div class="editor-label">
@Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.FirstName)
@Html.ValidationMessageFor(model => model.FirstName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.LastName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.LastName)
@Html.ValidationMessageFor(model => model.LastName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Email)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Email)
@Html.ValidationMessageFor(model => model.Email)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.PhotoPath)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.PhotoPath)
@Html.ValidationMessageFor(model => model.PhotoPath)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Description)
</div>
<div class="editor-field">
<textarea class="ckeditor" id="ckeditor" rows="10"></textarea>
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script type="text/javascript" src="../../ckeditor/ckeditor.js"></script>
EmployeeController
public class EmployeeController : Controller
{
public ActionResult Index()
{
var employeeRepository=new EmployeeRepository();
var employees = employeeRepository.GetAll();
var employeeList = employees.Select(employee => new EmployeeViewModel
{
EmployeeId = employee.EmployeeId,
FirstName = employee.FirstName,
LastName = employee.LastName,
PhotoPath = employee.PhotoPath,
Email = employee.Email,
Description = employee.Description
}).ToList();
return View(employeeList);
}
public ActionResult Create()
{
return View(new EmployeeViewModel());
}
[HttpPost]
public ActionResult Create(EmployeeViewModel vm)
{
if(ModelState.IsValid)
{
var employeeRepository=new EmployeeRepository();
var emp=new Employee
{
FirstName = vm.FirstName,
LastName = vm.LastName,
Description = vm.Description,
Email = vm.Email,
PhotoPath = vm.PhotoPath
};
employeeRepository.Insert(emp);
return RedirectToAction("Index");
}
return View(vm);
}
}
}
谢谢你的任何建议!
编辑示例使用CKEditor帮助程序
@using MvcApplicationCKEditorIntegration.Helpers
@model MvcApplicationCKEditorIntegration.Models.EmployeeViewModel
@{
ViewBag.Title = "Create";
}
<h2>
Create</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@Html.CKEditorHeaderScripts()
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)
<fieldset>
<legend>EmployeeViewModel</legend>
<div class="editor-label">
@Html.LabelFor(model => model.FirstName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.FirstName)
@Html.ValidationMessageFor(model => model.FirstName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.LastName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.LastName)
@Html.ValidationMessageFor(model => model.LastName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Email)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Email)
@Html.ValidationMessageFor(model => model.Email)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.PhotoPath)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.PhotoPath)
@Html.ValidationMessageFor(model => model.PhotoPath)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Description)
</div>
@Html.CKEditorFor(model=>model.Description)
<p>
<input type="submit" value="Create" onclick="@Html.CKEditorSubmitButtonUpdateFunction()" />
</p>
</fieldset>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
<script type="text/javascript" src="../../ckeditor/ckeditor.js"></script>
您实际上并没有像在该博客页面(这是我自己的博客)中描述的那样使用CKEditor助手.
该帮助程序的目的是,一旦您将代码正确地包含在项目中,您就可以这样做:
@Html.CKEditorFor(model=>model.Description)
但是,您似乎只是创建一个普通的文本区域并在此之后"手动"使用它.没有任何东西可以将它绑定到您的属性,如果您使用了该帖子中描述的帮助程序就会存在.
另请注意,您没有使用更新幕后文本区域的代码; 因此,如果您的模型已Required在该Description字段上设置,则在您第一次提交正确配置时,您将收到客户端验证错误.CKEditorFor()这对我的助手来说并不是唯一的; 任何"必需"的绑定属性也需要该博客文章中提到的Javascript位.我这样做是一个onclick关闭提交按钮,但你可以在任何地方运行相同的代码.您只需要将其包含在您尚未完成的页面中.
| 归档时间： |
|
| 查看次数： |
6490 次 |
| 最近记录： |