我正在从数据库中获取数据，然后以我想更新它的形式查看它。所以我想从数据库中的表中获取租赁详细信息值并在文本区域输入表单中查看它。我还集成了 ck编辑器，以便用户可以在文本区域上有效地进行编辑。我遇到的问题是能够从表中获取租赁详细信息的值，并且在文本区域中显示得很好，但是当我发送请求时它显示为空值尚未在文本区域上显示有文本。我测试了另一种情况，当我从文本区域中删除 ck 编辑器时，值是在发布请求时发送的
[![形式][1]][1]
表格
在提出发布请求时
[![当我发送帖子请求时][2]][2]
我可能哪里出错了？
在刀片文件中
<div class="form-group inputdetails"> <label>Rental Details<span class="text-danger inputrequired">*</span></label> <textarea class="form-control text-white bg-dark rental-details" name="rental_details" placeholder="Describe the Rental property here.explain it with as more details as possible" rows="4"> </textarea> </div>
在脚本中
$('.rental-details').ckeditor(); $('.rental_details').val(response.editrentalhsedetail.rental_details);
这是脚本中的 ajax 代码，它将表单中的数据发送到控制器
$(‘#edithouse’).click(function(){
var url = '{{ route("updaterentaldetails", ":id") }}'; updatehseurl = url.replace(':id',rentalhsedetailsid); var form = $('.updaterentaldetails')[0]; var formdata=new FormData(form); $.ajax({ url:updatehseurl, method:'POST', processData:false, contentType:false, data:formdata, success:function(response) { console.log(response); if (response.status==400) { $('#update_errorlist').html(" "); $('#update_errorlist').removeClass('d-none'); $.each(response.message,function(key,err_value) { $('#update_errorlist').append('<li>' + err_value + '</li>'); }) } else if (response.status==200) { alertify.set('notifier','position', 'top-right'); alertify.success(response.message); activerentalhousestable.ajax.reload(); $('#editrentalhsedetailsmodal').modal('hide'); } } }); })
我正在使用 ajax 调用将数据当前数据传递给 amodal
$('body').on('click','.editrentalhsedetails',function(){ var rentalhsedetailsid=$(this).data('id'); $.ajax({ url:'{{ url("admin/activerental",'') }}' + '/' + rentalhsedetailsid + '/edit', method:'GET', processData: false, contentType: false, success:function(response) { if (response.status==404) { alert(response.message); } else if(response.status==200) { // console.log(response.editrentalhsedetail.rental_details) $('#editrentalhsedetailsmodal').modal('toggle'); $('#rentalhouseid').val(response.editrentalhsedetail.id); $('.edit_title').html('Edit details for Rental house'); $('#rental_title').val(response.editrentalhsedetail.rental_name); $('#rental_slug').val(response.editrentalhsedetail.rental_slug); $('#monthly_rent').val(response.editrentalhsedetail.monthly_rent); $('#rentldetails').val(response.editrentalhsedetail.rental_details); $('#totalrooms').val(response.editrentalhsedetail.total_rooms); $('.rentalhseimage').val(response.editrentalhsedetail.rental_image); $('.rentalhsevideo').val(response.editrentalhsedetail.rental_video); $(".rentalselectcat").select2(); $(".rentalselectcat").val(response.editrentalhsedetail.housecategory.id).trigger('change'); $(".rentalhsevacancy").select2(); $(".rentalhsevacancy").val(response.editrentalhsedetail.vacancy_status).trigger('change'); $(".rentalhselocation").select2(); $(".rentalhselocation").val(response.editrentalhsedetail.houselocation.id).trigger('change'); var tagsobject = response.editrentalhsedetail.housetags; var tagsarray = $.map(tagsobject, function(el) { return el['id']; }); //pass array object value to select2 $(".rentaltagselect2").select2(); $('.rentaltagselect2').val(tagsarray).trigger('change'); // preview an image that was previously uploaded var showimage=$('#showimage').attr('src', '/imagesforthewebsite/rentalhouses/rentalimages/small/' + response.editrentalhsedetail.rental_image); $('.rentalimg').html(showimage); $('input[name^="is_featured"][value="'+response.editrentalhsedetail.is_featured+'"').prop('checked', true); $('input[name^="waterbill"][value="'+response.editrentalhsedetail.waterbill+'"').prop('checked', true); $('input[name^="electricitybill"][value="'+response.editrentalhsedetail.electricitybill+'"').prop('checked', true); $('input[name^="wifi"][value="'+response.editrentalhsedetail.wifi+'"').prop('checked', true); $('input[name^="generator"][value="'+response.editrentalhsedetail.generator+'"').prop('checked', true); $('input[name^="balcony"][value="'+response.editrentalhsedetail.balcony+'"').prop('checked', true); $('input[name^="parking"][value="'+response.editrentalhsedetail.parking+'"').prop('checked', true); $('input[name^="cctv_cameras"][value="'+response.editrentalhsedetail.cctv_cameras+'"').prop('checked', true); $('input[name^="servant_quarters"][value="'+response.editrentalhsedetail.servant_quarters+'"').prop('checked', true); } } }) // update rental tags details $('#edithouse').click(function(){ var url = '{{ route("updaterentaldetails", ":id") }}'; updatehseurl = url.replace(':id',rentalhsedetailsid); var form = $('.updaterentaldetails')[0]; var formdata=new FormData(form); $.ajax({ url:updatehseurl, method:'POST', processData:false, contentType:false, data:formdata, success:function(response) { console.log(response); if (response.status==400) { $('#update_errorlist').html(" "); $('#update_errorlist').removeClass('d-none'); $.each(response.message,function(key,err_value) { $('#update_errorlist').append('<li>' + err_value + '</li>'); }) } else if (response.status==200) { alertify.set('notifier','position', 'top-right'); alertify.success(response.message); activerentalhousestable.ajax.reload(); $('#editrentalhsedetailsmodal').modal('hide'); } } }); }) })``` where might I be missing the point here [1]: https://i.stack.imgur.com/L4CyO.png [2]: https://i.stack.imgur.com/6GGZ1.png
您是否将 ID 添加到 CKeditor textarea 以获得上述答案？
HTML：
<div class="form-group inputdetails"> <label>Rental Details<span class="text-danger inputrequired">*</span></label> <textarea class="form-control text-white bg-dark rental-details" name="rental_details" id="rental_details" placeholder="Describe the Rental property here.explain it with as more details as possible" rows="4"> </textarea> </div>
JS：
<script> ClassicEditor .create( document.querySelector( '#rental_details' ) ) .catch( error => { console.error( error ); } ); </script>
如果这不起作用，你能告诉我们你是通过编辑器输入数据还是只发布默认值？因为也许你没有设置正确。从上面的代码我们只能看到占位符，所以没有实际的数据。
更新：因此，如果您想发布来自 db 的旧数据（例如，在编辑功能中您想要执行的操作）：
<textarea class="form-control text-white bg-dark rental-details name="rental_details" id="rental_details">{!! old('rental_details', $oldDataDbQuery->rental_details) !!}</textarea>
假设您从具有“rental_details”属性的 $oldDataDbQuery 对象中获取对象无论如何只需传递您希望在 textarea 内默认位于字段中的数据，并小心使用 {!! ！！} 代替 {{ }}
更新 2：API 方式
控制器：
public function getRentalDetails(Request $request) { $rentalDetails = Model::where('id', $request->product_id)->find($request->product_id); return response()->json($product->rental_details); }
其中 Model 是您的模型，其中包含具有属性 rent_details 的对象，product_id（仅作为示例）是您当前正在使用的对象，如果您从浏览器传递数据并使用 {id} 之类的路由，您可以从请求中获取它。然后你返回那个字符串的 json 响应。
网页.php：
Route::match('getRentalDetails', 'Model@getRentalDetails')->name('getRentalDetails');
然后在您的刀片文件中，您只需使用 product_id 向该路由发出 ajax 请求，该路由将对其进行比较并找到特定路径的值。我知道的信息太少，所以我可以帮助你完全做到这一点，但你应该了解它现在是如何工作的。
编辑 3：在私下讨论之后，我做了一个工作示例，说明在显示模式并获得 api 响应后，你应该在页面上做什么以正确呈现 ck 编辑器字段：
let response = { key1 : 'val1', key2 : 'val2', rental_details_ck : '<p><b>data</b></p> from api with rental details of ckeditor', //this is data like ckeditor saves in database, for example }; $(document).ready(function(){ $("#rental_details_edit").click(function(){ // here u do ur ajax request, u can return rest of code block on success, make sure to pass in id for ajax call so that u can return relevant data for that record in database. //query should look like this - $rental_details_editor = Model::where('id', $id)->first(); // from controller u can return just object property needed, doesn't have to be whole object. $("#rental_details_ck").html('<textarea id="editor">' + response.rental_details_ck + '</textarea>'); ClassicEditor .create( document.querySelector( '#editor' ) ) .catch( error => { console.error( error ); } ); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <!DOCTYPE html> <html> <script src="https://cdn.ckeditor.com/ckeditor5/35.0.1/classic/ckeditor.js"></script> <body> <button id="rental_details_edit">Edit</button> <div id="rental_details_ck"> </div> </body> </html>
为了从索引页面设置 api，你必须在 web.php 中注册路由，在控制器中设置方法并将响应返回为 json。ajax 调用应该在标记的地方进行。
