ASP.NET MVC- KindEditor的使用

  我用過幾個EDITOR,仍是比較喜歡KINDEDITOR。這個工做可能最近要用到了,週末在家花時間瞭解了一下。作了一下備註在這裏,以備往後方便查閱。css

  1.首先去KINDEDITOR的官網下載最新的版本,而後在MVC的CONTENT文件夾下面把下載的包解壓放進去。html

  2.而後看一下VIEW視圖作一下引用,顯示app

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link rel="stylesheet" href="/Content/KindEditor/themes/default/default.css" />
    <script charset="utf-8" src="/Content/KindEditor/kindeditor-min.js"></script>
    <script charset="utf-8" src="/Content/KindEditor/lang/zh_CN.js"></script>
    <script>
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('textarea[name="txtContent"]', {
                resizeType: 1,
                uploadJson: '@Url.Action("UploadImages", "Default")'
            });
        });
    </script>
</head>
<body>
    <div>
        <form id="formGuestBook" method="post" action="/Default/Add">
            <!--類名/方法名-->
            姓名:<input type="text" id="txtName" name="txtName" /><br />
            內容:
            <textarea id="txtContent" name="txtContent" style="width:800px;height:400px;visibility:hidden;"></textarea>

            <input type="submit" name="btnSubmitGuestBook" value="提交留言" />
        </form>
    </div>
</body>
</html>

  3.這裏提交後給Controller後報錯,錯誤以下:post

  解決很簡單,在Controller的方法前加一下[ValidateInput(false)],以下代碼所示:this

     [ValidateInput(false)]
        public ActionResult Add(string txtName, string txtContent)
        {
            return View();
        }

  4.最後改自官網自帶的圖片上傳功能,原來是WEBFORM的HANDLER寫的。改爲MVC的。使用前需引用LITJSONurl

      public ActionResult UploadImages()
        {

            //String aspxUrl = HttpContext.Request.Path.Substring(0, HttpContext.Request.Path.LastIndexOf("/") + 1);
            String aspxUrl = "";

            //文件保存目錄路徑
            String savePath = "/Content/KindEditor/attached/";

            //文件保存目錄URL
            String saveUrl = aspxUrl + "/Content/KindEditor/attached/";

            //定義容許上傳的文件擴展名
            Hashtable extTable = new Hashtable();
            extTable.Add("image", "gif,jpg,jpeg,png,bmp");
            extTable.Add("flash", "swf,flv");
            extTable.Add("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");
            extTable.Add("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");

            //最大文件大小
            int maxSize = 1000000;
            //this.context = HttpContext;

            HttpPostedFileBase imgFile = HttpContext.Request.Files["imgFile"];
            if (imgFile == null)
            {
                showError("請選擇文件。");
            }

            String dirPath = HttpContext.Server.MapPath(savePath);
            if (!Directory.Exists(dirPath))
            {
                showError("上傳目錄不存在。");
            }

            String dirName = HttpContext.Request.QueryString["dir"];
            if (String.IsNullOrEmpty(dirName))
            {
                dirName = "image";
            }
            if (!extTable.ContainsKey(dirName))
            {
                showError("目錄名不正確。");
            }

            String fileName = imgFile.FileName;
            String fileExt = Path.GetExtension(fileName).ToLower();

            if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize)
            {
                showError("上傳文件大小超過限制。");
            }

            if (String.IsNullOrEmpty(fileExt) || Array.IndexOf(((String)extTable[dirName]).Split(','), fileExt.Substring(1).ToLower()) == -1)
            {
                showError("上傳文件擴展名是不容許的擴展名。\n只容許" + ((String)extTable[dirName]) + "格式。");
            }

            //建立文件夾
            dirPath += dirName + "/";
            saveUrl += dirName + "/";
            if (!Directory.Exists(dirPath))
            {
                Directory.CreateDirectory(dirPath);
            }
            String ymd = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo);
            dirPath += ymd + "/";
            saveUrl += ymd + "/";
            if (!Directory.Exists(dirPath))
            {
                Directory.CreateDirectory(dirPath);
            }

            String newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
            String filePath = dirPath + newFileName;

            imgFile.SaveAs(filePath);

            String fileUrl = saveUrl + newFileName;

            Hashtable hash = new Hashtable();
            hash["error"] = 0;
            hash["url"] = fileUrl;
            return Content(JsonMapper.ToJson(hash));

            //return View();
        }

        private ContentResult showError(string message)
        {
            Hashtable hash = new Hashtable();
            hash["error"] = 1;
            hash["message"] = message;


            return Content(JsonMapper.ToJson(hash));
        }
相關文章
相關標籤/搜索