Question

我目前正在创建一个在线考试系统。我想添加一个加载更多功能，这样审查员就不会对页面加载上的很多问题感到不知所措。我从不同来源获取了我的代码，并尝试根据我所知道的结合它们。

一切都很好但是问题是我在我的控制器中使用了html标签，我觉得这不对吗？基于MVC概念所关注的内容。我试图直接将html代码放在我的视图页面中但是我遇到了循环问题:(。这是我的代码。

MODEL

    public function getQuestion1($page, $id){
    $offset = 10*$page;
    $limit = 10;
    $sql = "select * from question_bank where examtype_id = $id limit $offset ,$limit";
    $result = $this->db->query($sql)->result();
    return $result;
}

CONTROLLER

    public function verbal(){
    $this->load->view('examination/includes/header');
    $this->load->view('examination/verbal_meaning');
    $this->load->view('examination/includes/footer');
}


public function getQuestion(){
    $page =  $this->input->get('page');
    $questions = $this->examination_model->getQuestion1($page,1);
    foreach($questions as $r) {
        echo "<div class='col-lg-6'>
        <br/>
        <label>"
        .$r->question_id.") ".$r->question.
        "</label>
        <div class='radio'>
        <ol type='1'>
        <div class='col-lg-6'>
        <li>
        <label>
        <input type='radio' name='verbal_q5' id='' value='1'>"
        .$r->option1.
        "</label>
        </li>
        <li>
        <label>
        <input type='radio' name='verbal_q5' id='' value='2'>"
        .$r->option2.
        "</label>
        </li>
        <li>
        <label>
        <input type='radio' name='verbal_q5' id='' value='2'>"
        .$r->option2.
        "</label>
        </li>
        </div>
        <div class='col-lg-6'>
        <li>
        <label>
        <input type='radio' name='verbal_q5' id='' value='3'>"
        .$r->option4.
        "</label>
        </li>
        <li>
        <label>
        <input type='radio' name='verbal_q5' id='' value='4'>"
        .$r->option5.
        "</label>
        </li>
        </div>
        </ol>
        </div>
        </div>";
    }
    exit;
}

查看

<div class="col-lg-12">
  <div class="container-fluid">
    <div class="row">
      <div id="ajax_table">

      </div>
    </div>
  </div>
</div>

JS

    <script>
  $(document).ready(function(){
    getquestion(0);
    $("#load_more").click(function(e){
      e.preventDefault();
      var page = $(this).data('val');
      getquestion(page);
    });
  });
  var getquestion = function(page){

    $.ajax({
      url:"<?php echo base_url() ?>examination/getQuestion",
      type:'GET',
      data: {page:page}
    }).done(function(response){
      $("#ajax_table").append(response);
      $('#load_more').data('val', ($('#load_more').data('val')+1));
      scroll();
    });
  };
  var scroll  = function(){
    $('html, body').animate({
      scrollTop: $('#load_more').offset().top
    }, 1000);
  };
</script>

Answer 1

你应该做的是：

使用循环创建一个带有所有标签的php，而不是直接将内容回显给ajax。然后将变量作为对ajax的响应发送，然后附加html内容以在元素ajax_table中查看。

这将是最好和最恰当的方式。

Answer 2

我认为大多数Codeigniter开发人员会同意html属于视图文件。

根据您的评论，“但我得到循环问题”我怀疑您没有正确地将值传递给视图文件。应该这样做。

public function getQuestion()
{
    $page =  $this->input->get('page');
    $data['questions'] = $this->examination_model->getQuestion1($page,1);
    $this->load->view('examination/question_view', $data);
}

请注意，模型返回已分配给数组$data，项目键为“questions”。

$data['questions'] = $this->examination_model->getQuestion1($page,1);

项目键成为视图中的变量。换句话说，$data['questions']成为视图中的变量$questions。请注意，$data将传递给load->view的第二个参数中的视图。

$this->load->view('examination/question_view', $data);

文件“ examination / question_view.php ”将包含PHP和HTML，并使用您在上面的控制器中显示的相同技术。

当您加载其他问题时，您的HTML会给您带来问题。主要问题是，根据您显示的内容，所有<input type=radio字段都具有相同的名称。单选按钮通过为每个相关按钮提供相同的名称属性而“分组”。正如您所知，当您向页面添加更多问题时，所有按钮将位于同一组中，因为所有按钮都具有相同的名称。糟糕。

下面我提供应该解决该问题的HTML，并将每个问题的答案保存在唯一的按钮组中。我还使用了一种更传统的方式来构建输入和标签。

此外，我删除了一些与布局和格式相关的HTML，以保持代码更具可读性。一旦你获得逻辑工作，你可以根据需要添加HTML元素和CSS类来创建你想到的布局。

这是我的“ examination / question_view.php ”

的版本

<?php
foreach($questions as $question) :
    $q_num = $question->question_id;
    $q_id = "q".$q_num;
    $name = "verbal_".$q_num;
    ?>
    <fieldset>
        <legend><?= "Question $q_num"; ?></legend>
        <div>
            <?= $question->question; ?>
        </div>
        <ol type='1'>
            <li>
                <?php $id = "{$q_id}_a1"; ?>
                <input type='radio' name='<?= $name; ?>' id='<?= $id; ?>' value='1'>
                <label for='<?= $id; ?>'><?= $question->option1; ?></label>
            </li>
            <li>
                <?php $id = "{$q_id}_a2"; ?>
                <input type='radio' name='<?= $name; ?>' id='<?= $id; ?>' value='2'>
                <label for='<?= $id; ?>'><?= $question->option2; ?></label>
            </li>
            <li>
                <?php $id = "{$q_id}_a3"; ?>
                <input type='radio' name='<?= $name; ?>' id='<?= $id; ?>' value='3'>
                <label for='<?= $id; ?>'><?= $question->option2; ?></label>
            </li>
            <li>
                <?php $id = "{$q_id}_a4"; ?>
                <input type='radio' name='<?= $name; ?>' id='<?= $id; ?>' value='4'>
                <label for='<?= $id; ?>'><?= $question->option4; ?></label>
            </li>
            <li>
                <?php $id = "{$q_id}_a5"; ?>
                <input type='radio' name='<?= $name; ?>' id='<?= $id; ?>' value='5'>
                <label for='<?= $id; ?>'><?= $question->option5; ?></label>
            </li>
        </ol>
    </fieldset>
    <?php
endforeach;

我实际上没有测试过这个标记，所以它可能并不完美。请原谅任何拼写错误或逻辑问题。

如果您不熟悉我使用的PHP替代语法 - 例如<?= $name; ?> - 与输入<?php echo $name; ?>相同。

您可能还会注意到我是如何通过在<?php ...code here... ?>内设置一些区域来放入和退出PHP处理器，然后键入HTML而不是将字符串回显给PHP。这样做没有性能损失。键入和阅读也更容易。（IMO）

我也倾向于在双引号字符串中评估变量。 e.g。

<?= "Question $q_num"; ?>

而不是使用点连接它们，例如

<?= "Question ".$q_num; ?>

结果是一样的，对我来说，第一个更容易打字和阅读。

另请注意在其中一些双引号字符串中使用花括号。 e.g。

<?php $id = "{$q_id}_a1"; ?>

“curlies”帮助PHP处理器找出哪个部分是变量，哪个部分是字符串文字。前面的例子也可以写成

<?php $id = $q_id."_a1"; ?>

顺便说一句，我注意到你在控制器中使用了exit;。我建议你不要在Codeigniter中使用exit或die，除了在开发阶段进行调试。最好让Codeigniter执行其定义的关闭过程。

Codeigniter加载更多内容按钮

2 个答案: