用jquery.form异步提交页面时,服务器端取不到Ueditor的值

Ueditor与Jquery.form插件兼容性解决方案

最新推荐文章于 2023-10-02 17:13:56 发布

原创最新推荐文章于 2023-10-02 17:13:56 发布 · 6.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#服务器 #function #javascript #class #firebug #action

.net 同时被 2 个专栏收录

10 篇文章

订阅专栏

WEB页面设计

5 篇文章

订阅专栏

本文介绍了解决Ueditor编辑器在使用Jquery.form插件时无法正常提交内容的问题。通过在提交前手动将编辑器的内容赋值给隐藏字段，确保了异步提交时内容能够正确传递至服务器。

根据Ueditor的帮助说明，默认情况下在服务器端或者Ueditor的值是Request.Form["editorValue"]。

1.在没有使用Jquery.form插件的情况下，点击页面的submit,是可以取到值的;

2.在使用Jquery.form插件异步提交页面的时候，发现点击submit之后，用firebug查看post信息，里面找不到editorValue，所以在服务端总是取不到Ueditor的值。

解决办法：

在页面form里添加一个hidden,在submit之前用editor.getContent()获取编辑器的值，并赋给这个hidden；

使用Jquery.form插件需要注意：不能再beforeSubmit在个事件中执行上面的操作，虽然也是在执行submit之前，但是提交到服务器端这个hidden还是没有内容的。

部分代码如下：

   <script language="javascript" type="text/javascript">
      var editor;
      $(document).ready(function() {
         editor = new baidu.editor.ui.Editor();
         editor.render("myEditor");        
      });
     
      function processJson(data) {
         if (data.status == "true") {
            top.$.messager.alert('提示信息', data.msg, 'info', function() {
               top.closeTab("页脚说明");            
             });
            
         }
         else {
            top.$.messager.alert('提示信息', data.msg, 'error');
         }
      }
      function SetVal() {
         var options = {
            url: "FootInfo.aspx?ps=SAVE",
            type: "post",
            dataType: "json",
            success: processJson
         };
         $("#myContent").val(editor.getContent()); //或者编辑器的值要写在这里或者上面，不能写在beforeSubmit事件里
         $("#formPost").ajaxSubmit(options);
      }
   </script>

<form id="formPost" method="post" action="">
   <input type="hidden" id="myContent" name="myContent" />
   <div id="content"> 
      <ul>
         <li id="editor" style="height:320px;">
            <label for="myEditor" style="vertical-align: top">
               页脚描述：
            </label> 
            <textarea id="myEditor"> <%=strSummary %></textarea>  
         </li>
      </ul>
      <div  class="pt10 pl125">
         <a id="btnSave" href="javascript:void(0)" onclick="SetVal()" class="btn_yl mr10"><span>
            <span class="fc_42">保存</span> </span></a>
      </div>
      
   </div>
   </form>