Question

我正在使用循环从模型对象中获取数据。我正在尝试在两个不同的div之间传递相同的变量i。我想要获得相同对象所需的i。我是这个领域的新手，也许我正在做一些愚蠢的事情。

任何帮助将不胜感激。

这是代码段

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped table-dark">
            <thead>
               <tr>
                  <th scope="col">S.N</th>
                  <th scope="col">Company Name</th>
                  <th scope="col">Trade Ref Date</th>

               </tr>
            </thead>
              <tbody>
          {% for i in records %}
              <tr>
              <!--I'm getting objects variable value in here-->
                  <th scope="row">1</th>
                  <td>{{i.company}}</td>
                  <td>{{i.address}}</td>
                  <td>{{i.contact}}</td>


                  </td>
               </tr>
            {% endfor %}
              </tbody>
         </table>
         <div class="modal fade" id="data1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
               <div class="modal-content">
                  <div class="modal-header">
                     <h3 class="modal-title title" id="exampleModalLabel">Trade Details</h3>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                     <span aria-hidden="true">&times;</span>
                     </button>
                  </div>
                  <div class="modal-body">
                     <div class="card-body card-block">
                        <div class="displaydata">
                           <div class="description">
                              <ul>
                              <!--I'm not able to get objects variable value in here-->
                                 <li>{{i.sn}}</li>
                                 <li>{{i.company}}</li>
                                 <li>{{i.address}}</li>
                                 <li>{{i.contact}}</li>
                              </ul>
                           </div>
                           <table class="table table-bordered">
                              <tbody>
                                 <tr>
                                    <th scope="col">Sales </th>
                                    <th scope="row">Purchase</th>
                                 </tr>
                                 <tr>
                                    <th scope="col"><span>Sale/Cancel Sales : </span>{{i.sales}}<span></span></th>

                                 </tr>

                                       </tbody>
                           </table>

Answer 1

您不能在循环外访问内部作用域变量，据我了解，您想在记录中选择的数据上显示说明和一些销售数据。如果是这样，则可以使用click事件。并获得传递函数中的特殊信息，并在您各自的位置显示这些数据。喜欢

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped table-dark">
            <thead>
               <tr>
                  <th scope="col">S.N</th>
                  <th scope="col">Company Name</th>
                  <th scope="col">Trade Ref Date</th>

               </tr>
            </thead>
              <tbody>
          {% for i in records %}
              <tr onclick="somefunction(i)">
              <!--I'm getting objects variable value in here-->
                  <th scope="row">1</th>
                  <td>{{i.company}}</td>
                  <td>{{i.address}}</td>
                  <td>{{i.contact}}</td>


                  </td>
               </tr>
            {% endfor %}
              </tbody>
         </table>

现在可以为clickevent编写功能

<script>
function somefunction(data){
  document.getElementById("sn").innerHTML = data.sn;
  document.getElementById("company").innerHTML = data.company;
  document.getElementById("addr").innerHTML = data.addr;
  document.getElementById("contact").innerHTML = data.contact;
  document.getElementById("sales").innerHTML = data.sales;
}
</script>

现在，当您单击/选择记录时，下面的div将包含您选择的记录

<div class="modal fade" id="data1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
               <div class="modal-content">
                  <div class="modal-header">
                     <h3 class="modal-title title" id="exampleModalLabel">Trade Details</h3>
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                     <span aria-hidden="true">&times;</span>
                     </button>
                  </div>
                  <div class="modal-body">
                     <div class="card-body card-block">
                        <div class="displaydata">
                           <div class="description">
                              <ul>
                              <!--I'm not able to get objects variable value in here-->
                                 <li id="sn">#</li>
                                 <li id="company"></li>
                                 <li id="addr"></li>
                                 <li id="contact"></li>
                              </ul>
                           </div>
                           <table class="table table-bordered">
                              <tbody>
                                 <tr>
                                    <th scope="col">Sales </th>
                                    <th scope="row">Purchase</th>
                                 </tr>
                                 <tr>
                                    <th scope="col"><span>Sale/Cancel Sales : </span><span id="sales"></span></th>

                                 </tr>

                                       </tbody>
                           </table>

Answer 2

您的代码是错误的，这部分代码将重复与记录数一样多，因此您将拥有许多i值

{% for i in records %}
              <tr>
              <!--I'm getting objects variable value in here-->
                  <th scope="row">1</th>
                  <td>{{i.company}}</td>
                  <td>{{i.address}}</td>
                  <td>{{i.contact}}</td>
                  </td>
               </tr>
            {% endfor %}

但是当您有很多-^）时，您想在下面插入i的哪个值

<li>{{i.sn}}</li>
<li>{{i.company}}</li>
<li>{{i.address}}</li>
<li>{{i.contact}}</li>

如何在同一模板中将变量的值从一个div传递到另一个div？

2 个答案: