2012-05-27 48 views
1

由於某種原因,我的Telerik MVC編輯器()不起作用。任何人都可以發現我做錯了什麼嗎?MVC4與Telerik編輯器不工作

I'm使用MVC4與Razor視圖發動機和Telerik的版本2012.1.214

_Layout.cshtml包括這樣的:

@using Smekklegt.Models 
@using Telerik.Web.Mvc.UI 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="is" xml:lang="is"> 
<head> 
<meta charset="utf-8" /> 
<title>@ViewBag.Title</title> 
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> 
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" /> 
<script src="@Url.Content("~/Scripts/jquery-1.7.2.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/modernizr-2.5.3.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/AjaxLogin.js")" type="text/javascript"></script> 
<meta name="viewport" content="width=device-width" /> 
<!-- Skrár frá template--> 
<link href="@Url.Content("~/Content/rikona/styles/galleriffic.css")" rel="stylesheet" type="text/css" /> 
<link href="@Url.Content("~/Content/rikona/style.css")" rel="stylesheet" type="text/css" /> 
<script src="@Url.Content("~/Content/rikona/js/jquery-1.3.2.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Content/rikona/js/jquery.opacityrollover.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Content/rikona/js/jquery.galleriffic.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Content/rikona/js/gallery-settings.js")" type="text/javascript"></script> 
<!--[if IE 6]> 
     <script src="../../Content/rikona/js/ie6-transparency.js"></script> 
     <script> 
      DD_belatedPNG.fix('#header .logo img, .subtitle img, .slideshow-container, .navigation-container #thumbs .thumbs li .thumb img, .navigation a.next, .footer-line, #sidebar .author-photo, .line, .commentlist .comment-reply-link, #contact-page #contact .submit'); 
     </script> 
     <link rel="stylesheet" type="text/css" href="../../Content/rikona/styles/ie6.css" /> 
    <![endif]--> 
<!--[if IE 7]> 
     <link rel="stylesheet" type="text/css" href="../../Content/rikona/styles/ie7.css" /> 
    <![endif]--> 
<!--[if IE 8]> 
     <link rel="stylesheet" type="text/css" href="../../Content/rikona/styles/ie8.css" /> 
    <![endif]--> 
@(Html.Telerik().StyleSheetRegistrar() 
        .DefaultGroup(group => group 
         .Add("telerik.common.css") 
         .Add("telerik.simple.css") 
         .Combined(true) 
         .Compress(true)) 
       ) 
</head> 
<body> 
<div id="wrap"> 
    <div id="header"> 
     <section id="login" style="float: right;"> 
      @Html.Partial("_LogOnPartial") 
     </section> 
     <section style="float: left;"> 
      <ul> 
       <li>@Html.ActionLink("Flokkar", "Index", "Category")</li> 
       <li>@Html.ActionLink("Vörur", "Index", "Product")</li> 
      </ul> 
     </section> 
     <div class="logo"> 
      <img src="../../Content/rikona/images/smekklegt_banner2.jpg" alt="logo" width="400px;" /> 
     </div> 
     <div id="nav">     
      <ul id="nav-pages"> 
       <li>@Html.ActionLink("Forsíða", "Index", "Home")<span>|</span></li> 
       @foreach (Category category in (IEnumerable<Category>)ViewData["Categories"]) 
       { 
        <li>@Html.ActionLink(category.Name, "FindProductsByCategory", "Product", new { catId = category.Id }, null)<span>|</span></li> 
       } 
       <li>@Html.ActionLink("smekklegt.is", "Contact", "Home")</li> 
      </ul> 
     </div> 
    </div> 
    <div id="frontpage-content"> 
     <div id="container"> 
      @RenderSection("featured", false) 
      <section class="content-wrapper main-content clear-fix"> 
       @RenderBody() 
      </section> 
     </div> 
    </div> 

    <div id="footer" style="margin-top: 15px;"> 
     <div class="footer-line"> 
     </div> 
      <p> 
       &copy; @DateTime.Now.Year Smekklegt ehf</p> 
     <div class="float-right"> 
      <ul id="social"> 
       <li><a href="https://www.facebook.com/sersaumadir.smekkir" target="_blank" class="facebook">Facebook</a></li> 
      </ul> 
     </div> 
    </div> 
    @Html.Telerik().ScriptRegistrar().jQuery(false).DefaultGroup(g => g.Combined(true).Compress(true)) 
</div> 

Create.cshtml包括這個:

@using Telerik.Web.Mvc.UI 
@model Smekklegt.Controllers.ProductFormViewModel 

@{ 
    ViewBag.Title = "Create"; 
} 

<h2>Create</h2> 

<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script> 
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script> 

@using (Html.BeginForm()) { 
@Html.ValidationSummary(true) 

<fieldset> 
    <legend>Product</legend> 

    <div class="editor-label"> 
     @Html.LabelFor(model => model.Product.Name) 
    </div> 
    <div class="editor-field"> 
     @Html.EditorFor(model => model.Product.Name) 
     @Html.ValidationMessageFor(model => model.Product.Name) 
    </div> 

    <div class="editor-label"> 
     @Html.LabelFor(model => model.Product.FK_Category) 
    </div> 
    <div class="editor-field"> 
     @*@Html.EditorFor(model => model.Product.FK_Category)*@ 
     @Html.DropDownListFor(d => d.Categories, new SelectList(Model.Categories, "Id", "Name")) 
     @Html.ValidationMessageFor(model => model.Product.FK_Category) 
    </div> 

    <div class="editor-label"> 
     @Html.LabelFor(model => model.Product.Description) 
    </div> 

    <div> 
     @{ Html.Telerik().EditorFor(m => m.Product.Description) 
       .Name("ProductCreateEditor") 
       .Encode(false) 
       .HtmlAttributes(new { style = "width: 500px;" }) 
       .Tools(t => t.Clear() 
       .Bold().Italic().Underline().Separator().JustifyCenter().JustifyLeft().JustifyRight().JustifyFull()) 
       //.Value((string)ViewData["ProductDescription"]) 
       .Render(); } 
    </div> 

    <p> 
     <input type="submit" value="Stofna" /> 
     <input type="button" value="Til baka" onclick="javascript:history.go(-1)"/> 
    </p> 
</fieldset> 
} 

我遇到的問題是,每次我加載我的頁面時,telerik編輯器出現,但我不能寫入文本區域。 (它看起來就像被禁用):(

+0

我注意到,腳本註冊商的位置可以有所作爲。例如,編輯器可以在RenderBody()中調用的視圖內工作,但如果它在_Layout中則不會。如果我在佈局之後添加了註冊服務商,它似乎對我有效,但不知道這是否有幫助。 – John

回答

3

更新 從佈局刪除此行

<script src="@Url.Content("~/Content/rikona/js/jquery-1.3.2.js")" type="text/javascript"></script> 

你只需要jQuery的一個版本,它們是相互矛盾的是我最好的選擇。

其他一切看起來正確


刪除此行

.Value((string)ViewData["ProductDescription"]) 

您正在使用EditorFor將值從模型中拉出。所以你只需要在一個地方設置值。您試圖將其設置在EditorForValue的兩個位置。

如果你只使用EditorEditorFor可以使用Value

所以選擇做EditorFor像這樣:

@{ Html.Telerik().EditorFor(m => m.Product.Description) 
    .Name("ProductCreateEditor") 
    ... 
    .Render(); 
} 

或者Editor

@{ Html.Telerik().Editor() 
    .Name("ProductCreateEditor") 
    ... 
    .Value((string)ViewData["ProductDescription"]) 
    .Render(); 
} 

正如約翰還規定確保您的Telerik腳本的位置在正確的位置。它必須位於底部的_Layout頁面中;

 @(Html.Telerik().ScriptRegistrar().jQuery(false).DefaultGroup(group => group.Combined(true).Compress(true))) 
    </body> 
</html> 
+0

謝謝你們的回答。 telerik腳本像你說的那樣放置在主體內_Layout頁面的底部。我也嘗試從編輯器刪除的Value部分刪除ViewData,但編輯器仍然無法工作。編輯器出現在頁面加載中,就好像一切都應該工作,但出於某種原因,我不能將我的標記放在文本區域並開始選擇編輯器。我檢查了Firebug,並沒有拋出任何腳本錯誤(只是爲了確定)。這是否可能是由於某些驗證錯誤或...? – gardarvalur

+0

我不得不看你的視圖,以保持編輯器以及你的佈局作出更明智的答案。你是否在佈局中包含你自己的jQuery腳本? –

+0

你說你從「Value」部分刪除了'ViewData' ......你是否像我顯示的那樣刪除了整個「Value」部分? –

相關問題