weixin_33701564
2012-06-12 18:08
采纳率: 0%
浏览 39

页面时间为什么不会随着ajax调用更新?

我创建了一个代码点火器应用程序,其中包括一个带有Ajax的页面。我本来以为Ajax页面是工作的,但是,我的页面中只有一个部分正在更新,其余部分仍然保持原样。

下面是控制器中的代码:index是在初始页面加载时调用的方法,当单击刷新按钮时调用的是index2()。

       public function index()
       {
           $this->load->model('locations_model');
           $data['clienthistory'] = $this->locations_model->get_locations();
           $data['main_content'] = 'dashboard';
           $this->load->view('includes/template', $data);
       }


       public function index2()
       {
          $this->load->model('locations_model');
          $data['clienthistory'] = $this->locations_model->get_locations();
          return json_encode($data['clienthistory']);                                                                     
       }

以下是我的视图:

 <h2>timer test</h2>
    <?php echo now();?>

<h2>Latest Client Status</h2>
            <?php echo form_open('Dashboard/index');          
            echo form_submit('submit', 'Refresh Client Data', 'id="clientsubmit" class="btn-primary"');
            ?>
      <div class="row-fluid">
             <div class="span12" id="ajaxcontainer">
               <table class="table table-bordered table-striped">
                <thead>
                 <tr>
                   <th>IP</th>                                                                                                          
                   <th>Name</th>                                                                           
                   <th>Last Updated</th>
                 </tr>
                 </thead>
                <tbody>
               <?php foreach ($clienthistory as $histitem): ?>
                    <tr>
                        <td><?php echo $histitem['network'] ?></td>
                        <td><?php echo $histitem['name'] ?></td>
                        <td><?php echo $histitem['lastupdated'] ?></td>
                    </tr>
               <?php endforeach ?>

                </tbody>
               </table>
       </div>

     <?php echo form_close();  ?>
     <script type="text/javascript">
        $('#clientsubmit').click(function() {                   
               $.ajax({                                
                    url:"<?php echo site_url('Dashboard/index2'); ?>",
                    type: 'POST',
                    dataType: 'html'
                    success: function(returnDataFromController) {
                          $('#ajaxcontainer').html(returnDataFromController)
                    }
                  });

       return false;      
     });
    </script>

我想在页面上显示当前时间,但是该区域却不会随着我的ajax调用更新。此外,当我单击刷新按钮时,除了更新表数据之外,时间也在更新。我不确定为什么会这样。任何帮助,都将不胜感激。

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • DragonWar% 2012-06-12 18:16

    Your button is a submit so it will refresh the page when clicked.

    You need to change it to something else, like <a></a> and append a action to it, something like this:

    <a href="#" id="clientsubmit" class="btn btn-primary">Refresh Client Data</a>
    

    Since you are using twitter bootstrap, the link won't mess with your layout adding a btn to it's class.

    Without the submit button, your page won't be refreshed and your date function will be intact.

    And just for precaution, disable that link/button when clicked until the request is returned.

    $('#clientsubmit').click(function() {
    $(this).attr("disabled", "disabled");
    ...
    $('#ajaxcontainer').html(returnDataFromController);
    $(this).removeAttr("disabled");
    ...
    

    And on your ajax call you will just update the ajaxcontainer element.

    Hope it helps.

    打赏 评论

相关推荐 更多相似问题