将自定义 table 行添加到 PHP 中的 HTML Table

Question

我有一个 HTML table 行，其中包含根据需要自定义的混合内容单元格。我想将此行动态添加到 HTML Table。但是在js中弹出错误。

php函数如下

function addRowtoTable(){
    $tblRow = '<tr>
              <td><input type="checkbox" name="record"></td>    
              <td for="section"><select name=\'section\' id=\'section\' class=\'form-control\' >    
                          <?php echo fill_sectionName($conn, $userRow[\'userName\']); ?></select></td>  
              <td for="fileRef"><input name ="fileRef" id="fileRef" class="form-control ui-autocomplete-input" autocomplete="on" placeholder="Enter File Reference"></td>   
              <td for="datepicker"><input class=\'form-control\' type="text" id="datepicker" placeholder="Mail Date"></td>                  
              <td for="section"><?php echo fill_SecurityClass(); ?></td>    
              <td for="section"><?php echo fill_Precedence(); ?></td>   
              <td for="section"><?php echo fill_AppointmentList($conn); ?></td> 
              <td for="section"><input name ="address1" id="address1" class="form-control ui-autocomplete-input" autocomplete="on" placeholder="Enter Stn Name"></td>   
              <td for="section"><?php echo fill_ModeOfDespatch(); ?></td>   
            </tr>
                    ';
    return ($tblRow);

请注意，我在 HTML 代码中调用 php 函数来填充自动完成、日期选择器和 select 对象。

将这个<tr>添加到我的table中的JS脚本如下：

$('#addtblRow').click(function() {
     var tblRowNew =  <?php echo addRowtoTable()?>  ;
    $("table tbody").append(tblRowNew);
  });

浏览器的报错信息截图是这样的

我能得到解决这个错误的帮助吗？

Answer 1

我做了不同的处理。在 php 中我声明了变量

<?php
    global $sectionNames;
    global $Prece;
    global $AddeeAppt;
    global $ModesOfDes;

    $sectionNames = fill_sectionName($conn, $userRow["userName"]);
    $Prece = fill_Precedence();
    $AddeeAppt = fill_AppointmentList($conn);
    $ModesOfDes = fill_ModeOfDespatch($conn);
 ?>

$("#addtblRow").click(function(){
      var numofrows = $("#num_rows").val();
      //window.alert(numofrows);
      for(var i=0;i<numofrows ;i++){
        addNewRow();
      }
    });

JS是这样修改的

   function addNewRow(){
    //
    var trd="";
    trd +="<tr>";
    trd +="<td><input type='checkbox' name='record' class='form-control'    ></td>";
    trd +="<td for='section'><select name='section' id='section' class='form-control'><?php echo $sectionNames ?> </select></td>";
    trd +="<td><input name='fileRef' class='form-control'></td>";
    trd +="<td for='datepicker'><input class='form-control' type='text' id='datepicker' placeholder='Mail Date'></td>";
    trd +="<td><?php echo $Prece ?></td>";
    trd +="<td><?php echo $AddeeAppt ?></td>";
    trd +="<td><input name='Address' class='form-control'></td>";
    trd +="<td><?php echo $ModesOfDes ?></td>";
    trd +="</tr>";
    $("table tbody").append(trd); 
}

代码对我来说工作正常。 PS：JS 不允许在其 var 变量中使用 return。所以所有 HTML Elements/Tags 都是连续的。

将自定义 table 行添加到 PHP 中的 HTML Table

Add custom table row to HTML Table in PHP

html

row

add