Search code examples
asp.netasp.net-mvceditorfroala

Froala WYSIWYG Editor - Asp.net MVC


I was used Froala WYSIWYG Editor. Uploaded Images was successfully save in correct path but doesn't show in editor.

<script>
      $(function() {
          $('#PostDesc').froalaEditor({
              imageButtons: ["removeImage", "replaceImage", "linkImage"],
              borderColor: '#00008b',
              imageUploadURL: '@Url.Action("FroalaUploadImage", "Posts")',
              imageParams: { postId: "123" },
              enableScript: false,
              fileUploadURL: '@Url.Action("FroalaUploadFile", "Posts")',
              fileUploadParams: { postId: "123" }
          });
      });
</script>

Action:

[HttpPost]
public ActionResult FroalaUploadImage(HttpPostedFileBase file, int? postId)
{
    var fileName = Path.GetFileName(file.FileName);
    var rootPath = Server.MapPath("~/img/Post/");
    file.SaveAs(Path.Combine(rootPath, fileName));
    return Json(new { link = "img/Post/" + fileName }, JsonRequestBehavior.AllowGet);
}

What is wrong in return Json(new { link = "img/Post/" + fileName }, JsonRequestBehavior.AllowGet);?

Update:

I use this editor in an area and It seams that i must change url.

I wrote

return Json(new UrlHelper(this.Request.RequestContext).Content("~/img/Post/" + fileName ), JsonRequestBehavior.AllowGet);

instead of

return Json(new { link = "img/Post/" + fileName }, JsonRequestBehavior.AllowGet);

but problem not solved yet!!


Solution

  • I found the problem.

    Must wrote

    return Json(new { link = new UrlHelper(Request.RequestContext).Content("~/img/Post/" + fileName) }, JsonRequestBehavior.AllowGet);