integrating tinymce with asp .net MVC 4.0
- by user1865670
using ASP .NET MVC 4.0 , VS2012.
In one of my page, I tried to integrate a WYSIWYG editor "TinyMCE". To integrate, I followed the following URL : .tugberkugurlu.com
My view page is like :
@model AboutModels
@using FileUploadDemo.Models
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="Scripts/tinymce/jquery.tinymce.js" type="text/javascript"></script>
@{
ViewBag.Title = "About";
}
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset>
<legend>About</legend>
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.PostedOn)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.PostedOn)
@Html.ValidationMessageFor(model => model.PostedOn)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Tags)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Tags)
@Html.ValidationMessageFor(model => model.Tags)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Content)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Content)
@Html.ValidationMessageFor(model => model.Content)
</div>
<p>
<input type="submit" value="Create" />
</p>
<p>
Posted Content : @ViewBag.HtmlContent
</p>
</fieldset>
}
Here my Model is like :
public class AboutModels
{
public string Title { get; set; }
public DateTime PostedOn { get; set; }
public string Tags { get; set; }
[UIHint("tinymce_jquery_full"), AllowHtml]
public string Content { get; set; }
}
My about page loads with all features.
"@html.EditorFor(model=>model.content)"
also loads fine. but no "WYSIWYG" pane(i donno what it is called, the pane is used to edit my text written in the textarea(HTml.editorFor())) is loaded. In the runtime, Exception is thrown in jquery.tinymce.js file.
Error Message :
`Unhandled exception at line 86, column 11 in http://localhost:1706/Home/About
0x800a01b6 - Microsoft JScript runtime error: Object doesn't support this property or method`
And give me two options, Continue or Break . If i continue, the page loads with features as i mentioned earlier. If i Break, then it stays in the jquery.tinymce.js file with a yellow text-background.
I have no experience with Javascript/jquery. And new in ASP .NET MVC 4.0, actually this is my first try of web application in .net.
I updated jquery from nuGet. What could be the possible ways to solve it?
