Question

所以在一个表中，我使用substr只在表中显示一定数量的单词，因为数据非常过分而且我已经成功地做到了这一点。但是，当用户点击“完整视图”时，我在尝试显示模态中的所有数据时遇到了一个表格。图标。

表格如下：

Table with Substr

然而在模态中我得到了回复：

Modal

正如你所看到的那样，它采用了＆＃39; substr＆＃39;并且只返回指定的单词数，但是我希望它返回整个单词。

关于如何在不失去桌面限制的情况下实现这一目标的任何建议。

这是文件的代码：

<h4><center>View All Proposals</center></h4>
      <div class = "container container-fluid"id = "table_container" style="width:auto; margin-top:50px;" class="mainbox col-md-6">
        <div class="row clearfix">
          <div class="col-md-12">
            <table class="table table-bordered table-hover" id="tab_logic">
              <thead>
                <tr >
                  <th class="text-center">
                    Proposal ID
                  </th>
                  <th class="text-center">
                    Proposal Title
                  </th>
                  <th class="text-center">
                    Proposal Description
                  </th>
                  <th class="text-center">
                    Course
                  </th>
                  <th class="text-center">
                    Tags
                  </th>
                </tr>
              </thead>
              <tbody>
                <!-- populating the table with information from mysql database -->
                <?php foreach ($proposals as $proposal) {
                  echo "<tr><td>";
                  echo $proposal['proposal_id'];
                  echo "</td><td>";
                  echo substr($proposal['proposal_title'],0,30) ."...";
                  echo "</td><td>";
                  echo substr($proposal['description'],0,50) ."...";
                  echo "</td><td>";
                  echo $proposal['course_title'];
                  echo "</td><td>";
                  echo $proposal['tag_title'];
                  echo "</td><td>";
                  echo '<p data-placement="top"
                  data-toggle="tooltip"
                  style="margin-left:5px" 
                  title="Full View">';
                  echo '<button class="btn btn-info btn-xs" 
                  data-title="View" 
                  data-toggle="modal" 
                  data-id="'; 
                  echo $proposal['proposal_id']; 
                  echo '" data-proposal="'; 
                  echo substr($proposal['proposal_title'],0,30) ."...";
                  echo '" data-desc="'; 
                  echo substr($proposal['description'],0,50) ."...";
                  echo '" data-course="'; 
                  echo $proposal['course_title'];
                  echo '" data-tag="'; 
                  echo $proposal['tag_title'];
                  echo '" data-target="#viewModal">';
                  echo '<span class="glyphicon glyphicon-eye-open" />';
                  echo '</button></p>';

                  echo "</td>";
                  echo "</td><td>";
                  echo '<p data-placement="top"
                  data-toggle="tooltip"
                  style="margin-left:5px"
                  title="Print">';
                  echo '<button class="btn btn-primary btn-xs" 
                  data-title="Print" 
                  data-toggle="modal" 
                  data-id="'; 
                  echo $proposal['proposal_id']; 
                  echo '" data-proposal="'; 
                  echo $proposal['proposal_title']; 
                  echo '" data-desc="'; 
                  echo $proposal['description']; 
                  echo '" data-course="'; 
                  echo $proposal['course_title'];
                  echo '" data-tag="'; 
                  echo $proposal['tag_title'];
                  echo '" data-target="#printModal">';
                  echo '<span class="glyphicon glyphicon-print" />';
                  echo '</button></p>';
                  echo "</tr>"; }
                  ?>
                </tbody>
              </table>
            </div>
          </div>
        </div>

模态：

 <div id="viewModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="viewModalLabel" aria-hidden="true">
              <div class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title">View Proposal: </h4>
                  </div>
                  <div class="modal-body">
                    <form id="viewForm">
                                            <div class="form-group">
                        <label for="code" class="control-label">Proposal ID:</label>
                        <input type="text" class="form-control" id="proposal_id" name="user_record_id" readonly="">
                      </div>
                      <div class="form-group">
                        <label for="title" class="control-label">Proposal Title:</label>
                        <input type="text" class="form-control" id="proposal_title_id" name="proposal_title">
                      </div>
                      <div class="form-group">
                        <label for="title" class="control-label">Proposal Description:</label>
                        <input type="text" class="form-control" id="desc_id" name="description">
                      </div>
                      <div class="form-group">
                        <label for="title" class="control-label">Course:</label>
                        <input type="text" class="form-control" id="course_id" name="course_title">
                      </div>
                    </form>
                  </div>
                  <div class="modal-footer">
                    <button id="cancel" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                  </div>
                </div>
              </div>
            </div>

模态的js：

<script>
  $(function(){
    $('#viewModal').on('show.bs.modal', function (event) {
      var button = $(event.relatedTarget);
      var proposal_id = button.data('id');
      var proposal_title = button.data('proposal');
      var description = button.data('desc');     
      var course_title = button.data('course');


      var modal = $(this);
      modal.find('.modal-title').text('View Proposal: ' + proposal_id);
      modal.find('.modal-body #proposal_id').val(proposal_id);
      modal.find('.modal-body #proposal_title_id').val(proposal_title);
      modal.find('.modal-body #desc_id').val(description);
      modal.find('.modal-body #course_id').val(course_title);

    });
  });
  </script>

用于php文件的SQL：

$stmt = $db_conx->prepare('SELECT DISTINCT p.proposal_id, p.proposal_title, p.description, c.course_title, t.tag_title  FROM proposal p LEFT JOIN proposal_tags pt on pt.proposal_id = p.proposal_id LEFT JOIN tag_details t on t.tag_code = pt.tag_code LEFT JOIN course_details c on c.course_code = p.course_code');
    $stmt->execute();
    //$count = $stmt>rowCount();
    $proposals = $stmt->fetchAll(PDO::FETCH_ASSOC);

提前致谢！

在模态中显示完整的表信息，在表中仅显示部分信息

0 个答案: