使用Javascript在Laravel刀片视图的数组中显示动态数据时出现问题

在一个Laravel应用程序上工作，我在数组中有一些数据。数据是关联数组的集合，其中每个数组都有一个标识号和一个策略代码集合。我正在提取数据并向刀片显示。在视图中，我在两列中进行了分区（使用引导网格系统）。在左列（col-md-4）中，am循环遍历变量并显示工作正常的标识号。在右边的一栏中，我有一个表格，根据身份证号的状态，我应该显示相应的保单代码

我想实现这样一种功能，即当用户单击或悬停在特定的标识号上时，相应的策略代码应显示在表tbody标记的右列（col-md-8）上。对于后续的标识号，应重复相同的操作（仅应在单击或悬停标识号后显示）

存储在名为asm的变量中的数组集合

array:1 [▼
  0 => array:2 [▼
    "identity_no" => "71360"
    "policy_code" => array:2 [▼
      0 => "IL2***********"
      1 => "IL2***********"
      2 => "IL2***********"
    ]
  ]
  1 => array:2 [▼
    "identity_no" => "68181"
    "policy_code" => array:3 [▼
      0 => "IL2**********"
      1 => "IL2***********"
      2 => "IL2***********"
      3 => "IL2***********"
    ]
  ]
  2 => array:2 [▼
    "identity_no" => "53983"
    "policy_code" => array:4 [▼
      0 => "IL2*************"
      1 => "IL2*************"
      2 => "IL2*************"
      3 => "IL2*************"
      4 => "IL2*************"
      5 => "IL2*************"
    ]
  ]
]

视图上的布局

<div class="row">
  <!-- lEFT column -->
  <div class="col-md-4">
   <div id="MainMenu">
    <div class="list-group panel">
      <!-- Level 1 -->
      @foreach($asm as $a)
       <a href="#" class="list-group-item list-group-item-primary" > Identity No: {{ $a['identity_no'] }} </a>
      @endforeach
      <!-- END level 1-->
    </div> 
  </div>
</div>
<!-- END left column-->

<!-- Right column-->
<div class="col-md-8">
      <table id="summary-table">
          <thead>
          <tr>
              <th>Policy Codes</th>
          </tr>
          </thead>
          <tbody>
          <tr>
              <td> <!-- Add dynamic policy codes--></td>
            </tr> 
          </tbody>
      </table>
</div>

@foreach（$asm作为$a）
@endforeach
政策代码

试试这个！我只知道javascript，所以解决方案是纯javascript和jquery，我在按钮上合并了悬停和单击事件。希望这能有所帮助

asm=[{
标识号：“1”，
政策代码：“bla BLA1111111”
}, {
身份证号码：“2”，
政策代码：“bla BLA22222”
}, {
身份证号码：“3”，
政策代码：“bla BLA33333”
}];
功能btns（）{
var btn=$（“”+asm[i].标识号+“”）；
$（btn）.attr（“数据搜索”，asm[i].标识号）
$（btn）.附加到（#按钮）
}
$（'#按钮'）。在（'单击鼠标上方'，'按钮'，函数（）上）{
log（'click on'，$（this.attr（'id'））；
var a=asm.filter（x=>x.identity\u no===$（this.attr（'id'））.map（x=>x.policy\u代码）；
console.log（“找到了！”，a）
//在col的另一边显示此项
});
对于（i=0；i

---

试试这个！我只知道javascript，所以解决方案是纯javascript和jquery，我在按钮上合并了悬停和单击事件。希望这能有所帮助

asm=[{
标识号：“1”，
政策代码：“bla BLA1111111”
}, {
身份证号码：“2”，
政策代码：“bla BLA22222”
}, {
身份证号码：“3”，
政策代码：“bla BLA33333”
}];
功能btns（）{
var btn=$（“”+asm[i].标识号+“”）；
$（btn）.attr（“数据搜索”，asm[i].标识号）
$（btn）.附加到（#按钮）
}
$（'#按钮'）。在（'单击鼠标上方'，'按钮'，函数（）上）{
log（'click on'，$（this.attr（'id'））；
var a=asm.filter（x=>x.identity\u no===$（this.attr（'id'））.map（x=>x.policy\u代码）；
console.log（“找到了！”，a）
//在col的另一边显示此项
});
对于（i=0；i

您可以这样做（在我的本地电脑上测试并发现它可以工作）：

var数据；
$（文档）.ready（函数（）{
数据={！！json_encode（$asm）！！}；
});
$（document）.on（“mouseenter”，“a”，function（）{
var policyCodes=''；
var identityNo=$（this.attr（'id'）；
对于（变量i=0；i

希望它有帮助：）

您可以这样做（在我的本地计算机上进行了测试，发现它工作正常）：

var数据；
$（文档）.ready（函数（）{
数据={！！json_encode（$asm）！！}；
});
$（document）.on（“mouseenter”，“a”，function（）{
var policyCodes=''；
var identityNo=$（this.attr（'id'）；
对于（变量i=0；i

---

希望有帮助：）

那么，在实现这一目标的过程中，您面临的问题是什么？@MayankPandeyz我不确定在单击或悬停使用特定标识号后，如何在表中显示策略代码Javascript@MayankPandeyz你对此有什么建议……那么，在实现这一目标的过程中，你面临的问题是什么？@MayankPandeyz我不确定在使用时单击或悬停特定标识号后如何在表中显示策略代码Javascript@MayankPandeyz你的建议是什么..你可以省略那个控制台语句，我把它包括进来是为了测试的目的.谢谢你的帮助，只是一些澄清。。那么标识号呢，我是否像使用策略代码一样使用AJAX填充它？是的，你完全正确，马丁，事实上，我只是忘了提到代码的那一部分：@foreach（$asm as$a）@endforeachI在我的回答中添加了这一点。。。谢谢：）你可以省略那个控制台语句，我把它包括进来是为了测试的目的。谢谢你的帮助，只是一些澄清。。那么标识号呢，我是否像使用策略代码一样使用AJAX填充它？是的，你完全正确马丁，事实上，我只是忘了提到代码的那一部分：@for

<script>
    var data;
    $( document ).ready(function() {
        data = {!! json_encode($asm) !!};
    });
    $(document).on("mouseenter", "a", function() {
        var policyCodes = '';
        var identityNo = $(this).attr('id');
        for(var i = 0; i < data.length; i++) {
            if(identityNo == data[i]['identity_no']) {
                for(var j = 0;j < data[i]['policy_code'].length;j++){
                    policyCodes += '<td>' + data[i]['policy_code'][j] + '</td>';
                }
            }

        }
        console.log(policyCodes);
        $('#summary-table tbody tr').html(policyCodes);
    });
</script>


@foreach($asm as $a)
                <a href="#" class="list-group-item list-group-item-primary" id="{{ $a['identity_no'] }}" > Identity No: {{ $a['identity_no'] }} </a>
                @endforeach