Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/asp.net-mvc/15.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 保存并加载引导所见即所得编辑器内容_Javascript_Asp.net Mvc_Html_Bootstrap Wysiwyg - Fatal编程技术网

Javascript 保存并加载引导所见即所得编辑器内容

Javascript 保存并加载引导所见即所得编辑器内容,javascript,asp.net-mvc,html,bootstrap-wysiwyg,Javascript,Asp.net Mvc,Html,Bootstrap Wysiwyg,我正在使用。它看起来很棒,可以将我的文本和插入的图像添加到内容区域 我所需要的是我想把内容保存到数据库中,当用户从下拉列表中加载模板名称时,我需要从数据库中填充编辑器 我尝试了$('#editor').html(),但不确定如何将此数据发送到服务器 注意:使用ASP.Net MVC使用ajax保存数据(反之亦然,用于加载) $.ajax({ 类型:“POST”, url:您的url, 数据:$(“#编辑器”).html(), 成功:成功, 数据类型:数据类型 }); (我不知道这是否是最好的方法

我正在使用。它看起来很棒,可以将我的文本和插入的图像添加到内容区域

我所需要的是我想把内容保存到数据库中,当用户从下拉列表中加载模板名称时,我需要从数据库中填充编辑器

我尝试了
$('#editor').html()
,但不确定如何将此数据发送到服务器

注意:使用
ASP.Net MVC

使用ajax保存数据(反之亦然,用于加载)

$.ajax({ 类型:“POST”, url:您的url, 数据:$(“#编辑器”).html(), 成功:成功, 数据类型:数据类型 }); (我不知道这是否是最好的方法,但它正在发挥作用)

考虑一个简单的模型:

public class Contact
{
    public string Notes { get; set; }
}
我使用一个简单的jquery脚本来获取所见即所得的内容,并将其放入一个隐藏的输入中

当用户单击“保存”按钮时,我会自动执行此操作

以下是JS:

<script language=javascript>

$(function () {
    $('#NotesWysiwyg').wysiwyg();
    $('#btnSave').bind('click', function () {
        $("#Notes").val($("#NotesWysiwyg").html().replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;'));
    });
});

要将内容发送到服务器进行保存,似乎很简单,只需通过$(“#editor”).html()获取数据并将其发送到服务器端

要将数据加载到编辑器,请执行以下操作:

$("#editor").html("<div><ul><li>demo</li></ul></div>")
大多数服务器端视图转义输出,但编辑器无法接受转义格式


希望这有帮助。

我只是使用了一个隐藏的文本区域,并在表单提交时从编辑器复制了html

我还使用了一个数据属性来指定目标输入名称,这样您就可以在同一页面上的多个编辑器中使用此方法

编辑器Html:

<div id="editor" name="editor" data-target="content" class="form-control wysiwyg mt-lg">*<?php fill the value on loading ?>*</div>
css:

.hidden {
    display: none !important;
    visibility: hidden !important;
}
在尝试了一些选项(加载数据)之后,我找到了一个解决方案

var shortdescrip = STRING1;
var findInit = '&lt;';
var reInit = new RegExp(findInit,'g');
shortdescrip = shortdescrip.replace(reInit, '<');
var findOut = '&gt;';
var reOut = new RegExp(findOut, 'g');

shortdescrip = shortdescrip.replace(reInit, '<').replace(reOut,'>');
$("#div1").html(shortdescrip);
var shortdescripp=STRING1;
var findInit='';
var reInit=new RegExp(findInit,'g');

shortdescrip=shortdescrip.replace(reInit,'加载数据怎么样?'显示一些示例,plz。
$("#editor").html("&lt;div&gt;&lt;ul&gt;&lt;li&gt;demo&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;")
<div id="editor" name="editor" data-target="content" class="form-control wysiwyg mt-lg">*<?php fill the value on loading ?>*</div>
<textarea type="text" class="hidden" name="content" id="content"></textarea>
<button type="submit" class="btn btn-danger copyeditor">Save</button>
   $(".copyeditor").on("click", function() {

       var targetName = $("#editor").attr('data-target');
       $('#'+targetName).val($('#editor').html());
    });
.hidden {
    display: none !important;
    visibility: hidden !important;
}
var shortdescrip = STRING1;
var findInit = '&lt;';
var reInit = new RegExp(findInit,'g');
shortdescrip = shortdescrip.replace(reInit, '<');
var findOut = '&gt;';
var reOut = new RegExp(findOut, 'g');

shortdescrip = shortdescrip.replace(reInit, '<').replace(reOut,'>');
$("#div1").html(shortdescrip);