Question

我有从php函数返回的多个数据。现在我想在模态上动态添加行来设置数据..我可以这样做，...？我已经在模态上定义了一行css。我希望用相同的css动态创建行。

    <div class="modal-content">

        <div class="modal-header">
          <h3>New Learner</h3>
        </div>

        <div class="modal-body">

            <table class="pure-table">                  
              <tr class="table-header">
                <th>Name</th>
                <th>Student ID</th>                    
                <th>e-mail</th>  
                <th></th>                 
              </tr>

              <!-- Generates all students who match Below generated based on Query Results clicked -->

              <tr class="table-data pure-table-odd">                    
                <td id="new_search_email_name"></td>
                <td id="new_search_email_student_number"></td>                    
                <td id="new_search_email_email"></td> 
                <td><a href="#" class="right-align" data-toggle="modal" data-target="#registration-form">
             <button id="use_existing_learner" name="use_existing_learner" onClick="edit()" type="add" class="pure-button pure-button-primary"><span class="icon-font">&#xe046;</span> Use This Learner </button>
             <!-- this button needs to somehow load all the data for this one into the reg form modal -->
          </a></td>                   
              </tr>
            </table>

        </div>

Answer 1

您可以获取所需的DOM元素，在本例中使用类“table-data pure-table-odd”。然后克隆它。

循环显示后端数据。通过使用特定ID或节点顺序将名称和其他详细信息注入对象。

并将其附加到具有“pure-table”类的节点。

您可以从JQuery获得所需的所有功能。像clone（），append（）等。

希望这有帮助。

下面给出了示例代码（未测试）。需要包含JSON中的循环部分。

var original_element = $("table-data pure-table-odd");
var clone_element = $(original_element).clone();

//name 1 and all comes from the json you have.
//you will have to loop through that data for this section
$(clone_element).find("td")[0].append("name 1"); 
$(clone_element).find("td")[1].append("student number 1"); 
$(clone_element).find("td")[2].append("email 1"); 
$(clone_element).find("td")[3].attr("id", "id 1"); 

$("pure-table").append(clone_element);

如何在模态上设置动态数据

1 个答案: