Question

如何添加一些ajax来加载我的视图部分？我已经完成了删除/添加和更新Ajax。

现在我不知道如何在不刷新浏览器的情况下加载数据。每次我执行删除/添加和更新时，我需要先刷新浏览器才能看到结果。我知道它可以通过从数据库自动加载数据而不刷新浏览器来解决问题。

模型

public function getManufacturerRecord(){ //view data
    $this->db->select('*')
             ->from('manufacturer');
    $query = $this->db->get();
    return $result = $query->result();
}

控制器

public function manufacturer_list(){
    if($this->session->userdata('is_logged_in')){

        $result['data'] = $this->manufacturer_model->getManufacturerRecord();

        $this->load->view('../template/header');
        $this->load->view('manufacturer', $result);
        $this->load->view('../template/footer');
    } else {
        redirect('main/restricted');
    }
}

查看

<div id="navscroll">
    <table class="table-condensed table-bordered table-striped table-hover">
        <thead>
            <tr>
                <th>ID</th>
                <th>Manufacturer</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            <?php if(!empty($data)): 
            foreach($data as $row) { ?>
            <tr>
                <td><?=$row->id;?></td>
                <td><?=$row->brand;?></td>
            </tr>
            <?php } else : ?>
            <tr>No Records Found!</tr>
            <?php endif; ?>
        </tbody>
    </table>
</div>
</div>

Answer 1

以下代码可帮助您排序问题

视图页面的几处变化

将表格ID添加为anchor()和<?=anchor("manufacturer/delete/{$row->id}","Delete", array('class'=>'btnDelete', 'data-id' => $row->id))?>功能，并将其替换为

form_open()

添加功能

将您的existion <?=form_open('manufacturer/add',array('id' => 'manifu_add_form'));?>功能替换为下面的

<?=form_button(['content'=>'Save', 'type' => 'submit', 'class'=>'btn btn-primary', 'id'=>'btnSubmit'])?>

并按以下方式提交功能

var site_url = "http://localhost/ci_attl/manufacturer/";
$("#manifu_add_form").submit(function(e){ 
    e.preventDefault(); 
    var manufacturer = $("#manufacturer").val(); 
    $.ajax({ 
        url: $(this).attr('action'), 
        method: "POST", 
        data: { manufacturer : manufacturer }, 
        success: function(data){ 
        console.log(data); 
        var obj = $.parseJSON(data); 
        if(obj.status == 'success') 
        { 
            var append = "<tr id='row-"+obj.last_id+"'><td>"+obj.last_id+"</td><td>"+manufacturer+"</td><td><a data-toggle='modal' href='#update"+obj.last_id+"'>Update</a>| <a href='"+site_url+obj.last_id+"'>Delete</a></td></tr>";
            console.log(append);
            $("#manu-table tbody").append(append); 
            $('#manifu_add_form')[0].reset(); 
        } 
        $("div.result").html(obj.msg); 
        }, 
        error:function(a,b,c) 
        { 
            alert(c); 
        } 
    }); 
});

添加Ajax脚本

anchor()

删除功能

按照以下

更改您的

<?=anchor("manufacturer/delete/{$row->id}","Delete", array('class'=>'btnDelete', 'data-id' => $row->id))?>

$('.btnDelete').click(function(){ //delete data 
    var a_href = $(this).attr('href'); 
    var id = $(this).data('id'); 
    $.ajax({ 
        type: "GET", 
        url: a_href, 
        success: function(data){ 
            $("#row-"+id).slideUp(); 
            $("div.result").html(data); 
        }, 
        error:function(a,b,c){ 
            console.log(c); 
        } 
    }); 
    return false 
});

并删除Ajax，如下所示

{{1}}

希望这能解决您的问题

Answer 2

为什么不在删除，更新，添加后使用重定向到该页面。

有路线：

$ route [＆＃39; temp＆＃39;] =＆＃39;控制器/功能＆＃39;;

重定向（BASE_URL（＆＃39;温度＆＃39;））;

没有路线：

重定向（BASE_URL（＆＃39;控制器/功能＆＃39;））;

如何使用CodeIgniter

2 个答案: