Я искал неделю сейчас для достойного полного рабочего примера того, как использовать AJAX с Codeigniter (я новичок AJAX). Сообщения, которые я видел, устарели – все языки программирования продвинулись.
Я хочу иметь форму ввода на странице, которая возвращает что-то на страницу (например, переменную, результат запроса базы данных или строку в формате html) без необходимости обновления страницы. В этом простом примере представлена страница с полем ввода, которая вставляет пользовательский ввод в базу данных. Я хотел бы загрузить другое представление после отправки ввода. Если бы я мог понять, как это сделать, я бы смог приспособить его, чтобы делать все, что мне нужно (и, надеюсь, это тоже поможет другим!)
У меня это в моем «тестовом» контроллере:
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); } }
Вот мой взгляд, названный «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(); ?>
Все, что происходит в настоящее время, это то, что я ввожу вход, обновляет базу данных и отображает представление «test / default» (он не обновляет страницу, но не отображает «test / names_list» по желанию. за любую помощь, и за то, что выгнали меня из моих страданий!
Установите уникальный идентификатор формы:
echo form_open('test/add', array('id'=>'testajax'));
Я предполагаю, что вы хотите заменить форму на представление:
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; });
лучше, если вы вернете URL-адрес в ответ json:
$.post("<?php echo base_url(); ?>test/add", {name: msg}, function(data) { $this.load(data.url); },"json");
от вашего последнего комментария – я сильно не предлагаю заменить тело, будет очень сложно поддерживать такой код.
но вот anser:
$.post("<?php echo base_url(); ?>test/add", {name: msg}, function(data) { $('body').replace(data); });