将数据属性与boostrap modal一起使用

时间:2019-04-08 02:50:12

标签: laravel-5.4

我在获取点击按钮的模态值时遇到麻烦, 假设我在该字段上有2个值,然后用按钮单击第一个字段,我得到第一个正确的字段的item_name。但是,当我单击第二个字段时,我得到了第一个字段的值。 这是下面的代码:

字段:

<div class="col-md-12">
     @foreach(App\LevelRewards::rewardType()->get() as $rewards)
         @if(Auth::user()->level >= $rewards->level_required || Auth::user()->level == $rewards->level_required )
            <div class="col-lg-2 col-md-3 col-sm-6 col-xs-6" style="margin: 5px 0px;">
               <div class="hovereffect">
                    <a href="#" class="d-block mb-4 h-100">
                   <input type ="hidden" name="id" value="{{$rewards->id}}"/>
                   <img class="img-responsive" src="{{asset('rewards_img/'.$rewards->picture)}}" alt="">
                    </a>
                <div class="overlay">
                 <h2 style="font-size: 14px;">{{$rewards->details}}</h2>
                 <button type="button" class="btn btn-info claimBtn" data-toggle="modal" data-target="#claimModal">Claim</button>
         @endif
     @endforeach
 </div>

对于模式:

<div class="modal fade" id="claimModal" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <h4 class="modal-title">{{$rewards->item_name}}</h4>
    </div>  
  <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>
</div>

这是脚本的内容:

<script>
$('#claimBtn').click(function(){
var form = new FormData($("#claimModal")[0]);
});
</script>

0 个答案:

没有答案