使用ajax更新时无法从summernote获取价值
Posted
技术标签:
【中文标题】使用ajax更新时无法从summernote获取价值【英文标题】：Cannot get value from summernote ,when using ajax update 【发布时间】：2020-02-07 10:31:09 【问题描述】：当我点击编辑按钮（我使用模式引导）时，所有值都存在，除了带有summernote的textarea。
如果你输入一些东西（在summernote中）并取消它，你的价值不会消失......它应该很清楚。
原谅我，我的英语太差了。
这是我的模态表单：
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close" ><span aria-hidden="true">×</span></button>
<h3 class="modal-title">Formulir Berita</h3>
</div>
<div class="modal-body form">
<form action="#" id="form" class="form-horizontal">
<input type="hidden" value="" name="id_berita"/>
<div class="form-body">
<div class="form-group">
<label class="control-label col-md-2">Tanggal penulisan</label>
<div class="col-md-9">
<div class="input-group">
<span class="input-group-addon">
<i class="fa fa-calendar"></i>
</span>
<input name="tgl" placeholder="yyyy-mm-dd" class="form-control datepicker" type="text">
<span class="help-block"></span>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2">Judul</label>
<div class="col-md-9">
<input name="judul" placeholder="Judul" class="form-control" type="text">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2">Penulis</label>
<div class="col-md-9">
<input name="penulis" placeholder="Penulis" class="form-control" type="text">
<span class="help-block"></span>
</div>
</div>
<div class="form-group" id="photo-preview">
<label class="control-label col-md-2">Gambar</label>
<div class="col-md-4">
(Tidak ada gambar)
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" id="label-photo">Unggah Foto </label>
<div class="col-md-7">
<div class="fileupload fileupload-new" data-provides="fileupload">
<div class="input-append">
<div class="uneditable-input">
<i class="fa fa-file fileupload-exists"></i>
<span class="fileupload-preview"></span>
</div>
<span class="btn btn-default btn-file">
<span class="fileupload-exists">Ganti Foto</span>
<span class="fileupload-new">Pilih File</span>
<input name="gambar" type="file" />
</span>
<span class="help-block"></span>
<a href="#" class="btn btn-default fileupload-exists" data-dismiss="fileupload">Remove</a>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2">Isi</label>
<div class="col-md-9">
<textarea name="isi" class="form-control" id="summernote" >
</textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" id="btnSave" onclick="save()" class="btn btn-primary">Simpan</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Batal</button>
</div>
</div>
</div>
</div>
我一直在尝试一些代码：
$('#summernote').summernote('code');
$('#summernote').summernote('reset');// and for resetting modal while Add Data
什么都没发生
我的 ajax 函数：
function edit_berita(id)
save_method = 'update';
$('#form')[0].reset(); // reset form on modals
$('.form-group').removeClass('has-error'); // clear error class
$('.help-block').empty(); // clear error string
//Ajax Load data from ajax
$.ajax(
url : "<?php echo site_url('sistem/berita/ajax_edit/')?>/" + id,
type: "GET",
dataType: "JSON",
success: function(data)
// $('#summernote').summernote('code');
$('[name="id_berita"]').val(data.id_berita);
$('[name="tgl"]').datepicker('update',data.tgl);
$('[name="judul"]').val(data.judul);
$('[name="isi"]').val(data.isi);
$('[name="penulis"]').val(data.penulis);
$('#modal_form').modal('show'); // show bootstrap modal when complete loaded
$('.modal-title').text('Edit data'); // Set title to Bootstrap modal title
$('#photo-preview').show(); // show photo preview modal
if(data.gambar)
$('#label-photo').text(''); // label photo upload
$('#photo-preview div').html('<img src="'+base_url+'upload/berita/'+data.gambar+'" class="img-responsive" >'); // show photo
$('#photo-preview div').append('<input type="checkbox" name="remove_photo" value="'+data.gambar+'"/> Remove photo when saving'); // remove photo
else
$('#label-photo').text(''); // label photo upload
$('#photo-preview div').text('(Tidak ada gambar)');
,
error: function (jqXHR, textStatus, errorThrown)
alert('Error get data from ajax');
);
【问题讨论】：
【参考方案1】：文本区域没有价值。 jQuery .html() 在这种情况下有效
$("textarea#summernote").html(data.isi);
【讨论】：
我一直在尝试将您的代码放入我的编辑功能中：但它不起作用感谢您的回答..【参考方案2】：尝试像这样修改summernote行：
$('#summernote').summernote('code', data.isi);
并清除内容：
$('#summernote').summernote('code', '');
【讨论】：
【参考方案3】：请试试这个：
$("textarea#summernote").val(data.isi);
【讨论】：
【参考方案4】：$( '[name="isi"]' ).val(data.isi);
$( '[name="isi"]' ).summernote();
【讨论】：
以上是关于使用ajax更新时无法从summernote获取价值的主要内容，如果未能解决你的问题，请参考以下文章
如何通过 ajax 从 Summernote 编辑器将数据发送到 php 文件？
如何使用 Ajax 将 Summernote 文本从 JSON 数据转换为纯文本？
通过 Ajax 将 Summernote 代码发布到 PHP，然后插入数据库