使用CodeIgniter通过AJAX提交表单

Question

我正在构建一个Web应用程序，它将让用户按照Q &格式进行讨论。为此，当显示问题时，每个问题旁边都有一个“关注”按钮。我希望用户能够在不重新加载页面的情况下遵循这些线程，从而使用AJAX。所以，我想要AJAX电话：

1）提交表单更新数据库记录下列关系;和 2）将“遵循”与提交按钮“下面的”

这里是我的JavaScript代码：

$("#submitFollow").click(function() { 
    var type = $("input#type").val(); 
    var u_id = $("input#u_id").val(); 
    var e_id = $("input#e_id").val(); 
    var dataString = 'type='+ type + '&u_id=' + u_id + '&e_id=' + e_id; 

    $.ajax({ 
     type: "POST", 
     url: "<?=site_url()?>/follow/ajaxFollow", 
     data: dataString, 
     success: function() { 
      $('#following').html("Following"); 
      .hide() 
      .fadeIn(1500) 
     } 
    }); 
    return false; 
}); 
}); 

这里是我的表单代码如下所示。我剔除了防止表单经常提交的行为和方法。我试图阻止默认使用JS，但是这没有奏效。 （该值由模型填写）：

<div id="following"> 
<form id="followForm" action="" method=""> 
<input type="hidden" name="type" id="type" value="question"> 
<input type="hidden" name="u_id" id="u_id" value="1"> 
<input type="hidden" value="12" name="e_id" id="e_id"> 
<input type="submit" id="submitFollow" value="Follow Question" class="submitFollow"> 
</form> 
</div> 

眼下控制器是非常简单 - 它只是需要交变量的阵列和直将其提交到数据库中。

我对JavaScript并不太了解，所以如果我花了一个简单的问题，我很抱歉。

Answer 1

我只是在这里一般，但希望它会有所帮助。如果是我，我会做类似如下：

这里的一些HTML，从笨产生：

<div> 
questions 1 
</div> 
<div> 
<a class="follow" href="http://example.com/follow/question/1">Follow Question 1</a> 
</div> 

<div> 
questions 2 
</div> 
<div> 
<a class="follow" href="http://example.com/follow/question/2">Follow Question 2</a> 
</div> 

然后，让没有JavaScript的一切工作（您添加更高版本）。所以这里是代码控制器的一些通用代码：

<?php 

class Follow extends Controller { 

    function Follow() 
    { 
     parent::Controller(); 
     $this->auth->restrict_to_admin(); 
    } 

    function question($id = NULL) 
    { 
     if($id) 
     { 
      //get question from database using the id 
      //i assume somehow the user is logged in? use their id where applicable 
      echo '<span>You are now following this question</span>'; 
     } 
    } 

} 

/* End of file follow.php */ 

现在，无论他们是否使用JavaScript，它都可以工作。这里是你添加javascript的地方（我假设你正在使用jquery？）。如果不是，它将足够接近。

$(document).ready(function(){ 
    $('follow').click(function(event){ 
     event.preventDefault(); 

     var followUrl = $(this).attr('href'); 
     //do ajax call here. 
     $.post(
     followUrl, 
     { 
      //any paramaters you need to add can 
      //go here in this format: 
      //param_key: param_value 
     }, 
     function(responseText){ 
      //here you can update the clicked link to say something 
      //like "you are now following this question" 
      //the responseText var will have whatever text the server responds with. 
      //just responsd with html 
     }, 
     'html' 
     ); 

    }); 
});