Javascript Codeigniter AJAX 示例
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13887095/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Codeigniter AJAX Example
提问by whispersan
I've been looking for a week now for a decent full working example of how to use AJAX with Codeigniter (I'm an AJAX novice). The posts / tuts I've seen are old - all the programming languages have moved on.
我一直在寻找一个完整的完整工作示例,说明如何将 AJAX 与 Codeigniter 一起使用(我是 AJAX 新手)。我看到的帖子/ tuts 已经过时了——所有的编程语言都在进步。
I want to have an input form on a page which returns something to the page (e.g. a variable, database query result or html formatted string) without needing to refresh the page. In this simple example is a page with an input field, which inserts the user input into a database. I'd like to load a different view once the input is submitted. If I could understand how to do this I'd be able to adapt it to do whatever I needed (and hopefully it would help others too!)
我想在页面上有一个输入表单,该表单向页面返回一些内容(例如变量、数据库查询结果或 html 格式的字符串),而无需刷新页面。在这个简单的例子中是一个带有输入字段的页面,它将用户输入插入到数据库中。提交输入后,我想加载不同的视图。如果我能理解如何做到这一点,我就能够调整它来做我需要的任何事情(希望它也能帮助其他人!)
I have this in my 'test' controller:
我的“测试”控制器中有这个:
function add(){
$name = $this->input->post('name');
if( $name ) {
$this->test_model->put( $name );
}
}
function ajax() {
$this->view_data["page_title"] = "Ajax Test";
$this->view_data["page_heading"] = "Ajax Test";
$data['names'] = $this->test_model->get(); //gets a list of names
if ( $this->input->is_ajax_request() ) {
$this->load->view('test/names_list', $data);
} else {
$this->load->view('test/default', $data);
}
}
Here is my view, named 'ajax' (so I access this through the URL www.mysite.com/test/ajax)
这是我的视图,名为“ajax”(所以我通过 URL www.mysite.com/test/ajax 访问它)
<script type="text/javascript">
jQuery( document ).ready( function() {
jQuery('#submit').click( function( e ) {
e.preventDefault();
var msg = jQuery('#name').val();
jQuery.post("
<?php echo base_url(); ?>
test/add", {name: msg}, function( r ) {
console.log(r);
});
});
});
</script>
<?php echo form_open("test/add"); ?>
<input type="text" name="name" id="name">
<input type="submit" value="submit" name="submit" id="submit">
<?php echo form_close(); ?>
All that happens currently is that I type in an input, updates the database and displays the view "test/default" (it doesn't refresh the page, but doesn't display "test/names_list" as desired. Many thanks in advance for any help, and for putting me out of my misery!
当前发生的所有事情是我输入一个输入,更新数据库并显示视图“test/default”(它不会刷新页面,但不会根据需要显示“test/names_list”。提前非常感谢任何帮助,让我摆脱痛苦!
采纳答案by zb'
Set unique id to the form:
将唯一 id 设置为表单:
echo form_open('test/add', array('id'=>'testajax'));
I assume that you want replace a form with a view:
我假设您想用视图替换表单:
jQuery(document).ready(function(){
var $=jQuery;
$('#testajax').submit(function(e){
var $this=$(this);
var msg = $this.find('#name').val();
$.post($this.attr('action'), {name: msg}, function(data) {
$this.replace($(data));
});
return false;
});
better way if you return url of view in json response:
如果您在 json 响应中返回视图 url 的更好方法:
$.post("<?php echo base_url(); ?>test/add", {name: msg}, function(data) {
$this.load(data.url);
},"json");
从你最后的评论 - 我 strongly强烈不建议替换 body,这样的代码会很难支持。
but here is anser:
但这里是 anser:
$.post("<?php echo base_url(); ?>test/add", {name: msg}, function(data) {
$('body').replace(data);
});

