use laravel5.7+wangEditor3.1 to publish the content of the article.
add the js code of the article part, and then submit the data in the way of ajax, which is not suitable for this way
<script type="text/javascript">
$.ajaxSetup({
headers: {
"X-CSRF-TOKEN": $("meta[name="csrf-token"]").attr("content")
}
});
var E = window.wangEditor;
var editor = new E("-sharpdiv1");
// editor.customConfig.debug = true;
//
editor.customConfig.uploadImgServer = "/article/upimg";
// name
editor.customConfig.uploadFileName = "wangEditorH5File";
// headers
editor.customConfig.uploadImgHeaders = {
"X-CSRF-TOKEN": $("meta[name="csrf-token"]").attr("content")
};
//
editor.customConfig.uploadImgHooks = {
customInsert: function (insertImg, result, editor) {
var url = result.data;
//
insertImg(url);
}
};
editor.create();
document.getElementById("btn").addEventListener("click", function () {
var res = editor.txt.html();
var title = $("input[name=title]").val();
$.ajax({
url: "/article/add",
method: "POST",
dataType: "json",
data: {
"content": res,
"title": title
},
success: function (data) {
console.log(data.status);
if (data.status == "ok") {
alert(" ");
window.location.href = "/article/list";
}
}
});
}, false);
with html code:
<div class="form-group">
<label></label>
<input name="title" type="text" class="form-control" placeholder="" value="{{$data->title}}">
</div>
<div class="form-group">
<label></label>
<div id="div1" class="toolbar">
{!! $data->content !!}
</div>
</div>
<button type="button" class="btn btn-default"></button>
to edit the article on the basis of the above, there are some doubts in the data sending part. The editing route in
laravel is defined as
Route::put ("/ edit/ {article}", "AdminArticleController@edit").
first question: the url part needs to get the id value of the article and pass it through parameters. The form of form form is very convenient.
< form action= "/ article/edit/ {{$data- > id}}" method= "POST" >
but what should I do in ajax? does ajax support put?
second question: how should I encapsulate editing and adding methods? it"s a headache to write such a lot every time. Js really doesn"t know how to encapsulate it.
document.getElementById("btn").addEventListener("click", function () {
var res = editor.txt.html();
var title = $("input[name=title]").val();
$.ajax({
url:,
method: "POST",
dataType: "json",
data: {
"content": res,
"title": title
},
success: function (data) {
console.log(data.status);
if (data.status == "ok") {
alert(" ");
window.location.href = "/article/list";
}
},
error:function(data){
.......
}
});
}, false);