ASP.NET MVC: JavaScript выполняется правильно при создании представления, но не редактировании - PullRequest
1 голос
/ 21 августа 2010

У меня есть два вида: создание и редактирование.Оба имеют строго типизированный пользовательский элемент управления шаблона редактора.

У меня есть редактор jQuery wysiwyg в шаблоне общего редактора, и он прекрасно работает без ошибок в представлении создания, но когда я загружаю представление редактирования, Firefox сообщает, что «$ не определено» «jqueryне определено "и т. д.

Кроме того, изображения из 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>

Создать действие

//
        // GET: /News/Create

        public ActionResult Create()
        {
            var newsArticle = new NewsArticle();

            var viewModel = new NewsViewModel()
            {
                NewsArticle = newsArticle
            };

            return View(viewModel);
        } 

Вид редактирования:

<%@ 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>

Действие редактирования

 //
        // GET: /News/Edit/5

        public ActionResult Edit(int id)
        {
            var viewModel = new NewsViewModel()
            {
                NewsArticle = mhndb.NewsArticles.Single(n => n.ArticleID == id)
            };

            TempData["NewsViewModel"] = viewModel;

            return View(viewModel);
        }

Общий шаблон редактирования

<%@ 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>

Скрипты с сайта. 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>

1 Ответ

0 голосов
/ 21 августа 2010

Поскольку вы используете относительный путь в своем теге script, ссылка на исходный файл jQuery будет работать только для страниц, которые находятся на двух уровнях в глубине иерархии путей вашего сайта, например, News / Create. Если путь имеет глубину в три уровня, например, News / Edit / 5, теперь у вас неверный путь к сценарию, и веб-сервер выдаст ошибку 404, когда браузер попытается выполнить ее. Вы увидите эту ошибку, если посмотрите на панель Fiddler или Firebug Net, когда ваш сайт загружается.

Вместо относительных путей, вы должны использовать URL.Content в ссылках вашего скрипта, например:

<script src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>" type=".....
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...