ASP.NET MVC:Javascript在创建视图上正确执行,但在编辑视图上不正确执行
我有两个视图:创建和编辑。两者共享一个强类型编辑器模板用户控件 我在共享编辑器模板上有一个jQuery wysiwyg编辑器,它在创建视图上运行良好,没有错误,但是当我加载编辑视图时,firefox报告“$is not defined”“jQuery not defined”等 此外,编辑视图上site.master的图像不会加载,尽管页面源中的路径与创建视图中的路径相同。我正在使用WYSIWYG编辑器将HTML保存到数据库中,并将其加载到编辑视图的文本区域中,这可能是问题所在吗 相关代码如下: 创建视图ASP.NET MVC:Javascript在创建视图上正确执行,但在编辑视图上不正确执行,javascript,jquery,asp.net-mvc,templates,asp.net-mvc-2,Javascript,Jquery,Asp.net Mvc,Templates,Asp.net Mvc 2,我有两个视图:创建和编辑。两者共享一个强类型编辑器模板用户控件 我在共享编辑器模板上有一个jQuery wysiwyg编辑器,它在创建视图上运行良好,没有错误,但是当我加载编辑视图时,firefox报告“$is not defined”“jQuery not defined”等 此外,编辑视图上site.master的图像不会加载,尽管页面源中的路径与创建视图中的路径相同。我正在使用WYSIWYG编辑器将HTML保存到数据库中,并将其加载到编辑视图的文本区域中,这可能是问题所在吗 相关代码如下:
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<MHNHub.ViewModels.NewsViewModel>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Create
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeaderContent" runat="server">
<strong>Create</strong>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<% using (Html.BeginForm())
{%>
<%: Html.ValidationSummary(true) %>
<fieldset>
<legend>News Article</legend>
<div id="form_wrapper">
<div id="form_top">
<p class="formTitle">
New Post</p>
<p class="requiredField">
<span class="valid">*</span>Required Field</p>
</div>
<div id="form_mid">
<% if (Model.HasError)
{ %>
<em class="error">
<%: Model.ErrorMessage %></em>
<%} %>
<%: Html.EditorFor(model => model.NewsArticle)%>
<div id="form_buttons">
<input type="submit" value=" " id="Create" />
<%: Html.ActionLink(" ", "Index", "News", null, new{ id = "BackToList"}) %>
</div>
</div>
<div id="form_bottom">
</div>
</div>
</fieldset>
<% } %>
</asp:Content>
编辑视图:
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<MHNHub.ViewModels.NewsViewModel>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Edit
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeaderContent" runat="server">
<strong>Edit</strong>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<% using (Html.BeginForm("Edit", "News", new { id = Model.NewsArticle.ArticleID }))
{%>
<%: Html.ValidationSummary(true) %>
<fieldset>
<legend>News Article</legend>
<div id="form_wrapper">
<div id="form_top">
<p class="formTitle">
Existing Post</p>
<p class="requiredField">
<span class="valid">*</span>Required Field</p>
</div>
<div id="form_mid">
<% if (Model.HasError)
{ %>
<em class="error">
<%: Model.ErrorMessage %></em>
<%} %>
<%: Html.EditorFor(model => model.NewsArticle)%>
<div id="form_buttons">
<input type="submit" value=" " id="Update" />
<%: Html.ActionLink(" ", "Index", "News", null, new{ id = "BackToList"}) %>
</div>
</div>
<div id="form_bottom">
</div>
</div>
</fieldset>
<% } %>
</asp:Content>
共享编辑模板
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<MHNHub.Models.NewsArticle>" %>
<div class="editor-label">
Article Title<span class="valid">*</span>
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.Title) %>
<%: Html.ValidationMessageFor(model => model.Title) %>
</div>
<div class="editor-label">
Subtitle
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.Subtitle) %>
<%: Html.ValidationMessageFor(model => model.Subtitle) %>
</div>
<div class="editor-label">
Description
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.Description) %>
<%: Html.ValidationMessageFor(model => model.Description) %>
</div>
<div class="editor-label">
Article Content <span class="valid">*</span>
</div>
<div class="editor-field">
<%: Html.TextAreaFor(model => model.ArticleContent, new{id="wysiwyg", name="wysiwyg"}) %>
<%: Html.ValidationMessageFor(model => model.ArticleContent) %>
</div>
<div class="editor-label">
Category ID
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.CategoryID) %>
<%: Html.ValidationMessageFor(model => model.CategoryID) %>
</div>
文章标题*
型号(名称)%>
型号(名称)%>
字幕
型号(副标题)%>
型号(副标题)%>
描述
型号(说明)%>
型号(说明)%>
文章内容*
model.ArticleContent,新的{id=“wysiwyg”,name=“wysiwyg”})%>
model.ArticleContent)%>
类别ID
型号.类别ID)%>
型号.类别ID)%>
来自site.master的脚本
<link href="../../Content/jquery.cleditor.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.cleditor.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#wysiwyg").cleditor();
});
</script>
$(文档).ready(函数(){
$(“#所见即所得”).cleditor();
});
因为您在脚本中使用的是相对路径,所以对jQuery源文件的引用只适用于恰好位于站点路径层次结构中两个层次的页面,如News/Create。有了三层深度的路径,比如News/Edit/5,您现在有了一个错误的脚本路径,当浏览器尝试遵循该路径时,web服务器将返回404错误。如果在加载站点时查看Fiddler或Firebug的网络面板,您将看到此错误
您应该在脚本引用中使用URL.Content,而不是相对路径,例如:
<script src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>" type=".....
生成的html有效吗(使用检查)?这就很好地解释了为什么我的脚本在编辑视图上都不能正常工作,因为它们具有URL的额外级别。谢谢
<link href="../../Content/jquery.cleditor.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.cleditor.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#wysiwyg").cleditor();
});
</script>
<script src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>" type=".....