重写后的标题为:使用Laravel Ajax 从数组中逐个删除元素
P粉356361722
P粉356361722 2023-08-28 14:20:24
[MySQL讨论组]

我正在尝试从通过Append显示为图像的数组中删除每个元素。

刀片:

<h4>菜单图片</h4>
<div class="col-md-12" id="cardImages"></div>

Ajax函数

$(document).on('click', '.edit', function(){
  $("#cardImages").empty();
  var id = $(this).attr("id");
  $('#form_output').html('');
  $.ajax({
      url: "{{route('restaurantOffers.fetchdata')}}",
      method: 'get',
      data: {id:id},
      dataType: 'json',
      success:function(data)
      {
          $('#contract_id').val(id);                
          $('#editContract').modal('show');
          $('#action').val('Speichern');
          $('.modal-title').text('数据更新');
          $('#button_action').val('update');

          var cardUp = data.cardUpload;

          $.each(cardUp, function(index,value) {
            $('#cardImages').append('<a href="{{ url('/storage/offerPic/')}}'+'/' + value +'" download ><img src="{{ url('/storage/offerPic/')}}'+'/' + value +'" alt=""></a><a class="btn btn-danger" target="_blank" rel="nofollow noreferrer" href="" method="post">X</a>');

        });

      }
  })
});

控制器:

function fetchdata(Request $request)
{
    $id = $request->input('id');
    $data = RestaurantOffer::find($id);
    $output = array(            
        'cardUpload'    =>  json_decode($data->cardUpload),            
    );
    echo json_encode($output);
}

cardUpload列记录存储为数组,例如(["image1.png","image2.png"])。

这些图像在cardImages div中显示得很好,但我想创建一个函数来逐个删除这些图像。

问题是如何逐个删除数组元素。

PS:这些图像在编辑按钮之后显示。因此,我必须在get方法中创建删除或发布方法。

提前感谢您的帮助

P粉356361722
P粉356361722

全部回复(1)
P粉002572690

要删除特定的图像,您应该为每个图像确定一个特定的id:

([1=>"image1.png",2=>"image2.png"]).

function delete(Request $request)
{
    $id = $request->input('id');
    $imageIdToDelete=$request->input('image_index') ;
    $data = RestaurantOffer::find($id);
    $images=json_decode($data->cardUpload,true) ;
    if(isset($images[$imageIdToDelete])){
    unset($images[$imageIdToDelete]) ;
    }
    

    $data->update([
       'cardUpload'=>json_encode($images)
                     ]) ;
    
}

删除按钮:

$.each(cardUp, function(index,value) {
     $('#cardImages').append('<a href="{{ url('/storage/offerPic/')}}'+'/' + value +'" download >
<img src="{{ url('/storage/offerPic/')}}'+'/' + value +'" alt=""></a>

    <button class="btn btn-danger delete" data-index=index  >delete</button>');

        });


$('delete').on('click',function(){
var image_index= $(this).attr('data-index')
})

$.ajax({
   url: "{{route('restaurantOffers.delete')}}",
   method: 'get',
   data: {image_index:image_index},
   dataType: 'json',
})

请不要建议编辑,如果您建议我无法编辑它,必须发布另一个答案。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号