How to mesh codeigniter with ajax

社会主义新天地 提交于 2019-12-25 05:28:10

问题


I am trying to implement a ajax plus one button with my site in code igniter. I am very new with Ajax and codeigniter so I'm needing some guidance.

Here is the portion of my controller where I'm starting. Please note, this is inside the method that creates my profile view in which I'm trying to create this.

$voteId=  $this->input->post('voteId');

                    $upOrDown=  $this->input->post('upOrDown');

                    $status ="false";
                    $updateRecords = 0;

                    if($upOrDown=='upvote'){
                        $updateRecords = $this->community_model->updateUpVote($voteId);
                    }else{
                        $updateRecords = $this->community_model->updateUpVote($voteId);
                    }

                    if($updateRecords>0){
                        $status = "true";
                    }
                    echo $status;

            // This variable will be accessed from the view
            $data['airwave'] = $airwave;
            $data['profile_id'] = $profile_id;
            $this->load->view('includes/templates/main_page_template', $data);
            }

Here is the method in the model:

function updateUpVote($voteId){
                $sql = "UPDATE airwaves_comments set thumbsup = thumbsup+1 WHERE thumbsup =?";
                $this->db->query($sql, array($voteId));
                return $this->db->affected_rows();
            }       

here is my view:

<div id='thumb_holder'>
  <div id='thumb_report'>
    <a href='mailto:info@cysticlife.org'>
        &#149 report
    </a>
</div>
<div  class= 'thumb_counter'>
        +0
</div>
<div id='thumb_thumb'>
<a class='myButtonLink voteMe' id='1_upvote'<span id="1_upvote_result">+</span>></a>
    </div>
</div>

here is the script:

<script>
        $(document).ready(function(){
              $(".voteMe").click(function() {
                var voteId = this.id;
                var upOrDown = voteId.split('_'); 
                $.ajax({
                    type: "post",
                    url: "account/profile/voteMe",
                    cache: false,               
                    data:'voteId='+upOrDown[0] + '&upOrDown=' +upOrDown[1],
                    success: function(response){                
                        try{
                            if(response=='true'){   
                                var newValue = parseInt($("#"+voteId+'_result').text()) + 1;            
                                $("#"+voteId+'_result').html(newValue);
                            }else{
                                alert('Sorry Unable to update..');
                            }
                        }catch(e) {     
                            alert('Exception while request..');
                        }       
                    },
                    error: function(){                      
                        alert('Error while request..');
                    }
                 });
            });
        });
    </script>

additionally here is what it looks like to give a better idea of what's going on, but I want there to be the number of votes after the plus sign:

To summarize: Essentially I was taking a tutorial on a demo tutorial that is similar, but it was not exactly what I am trying to do. This is basically me taking the code from the tutorial and trying to splice it with my code and meet my specific needs and learning ajax at the same time. I feel like I'm close as it's updating the specified column in my table (incorrectly),however can't get it to visibly function.


回答1:


I'm not exactly sure what your saying your problem is. But This I do see.

When trying to fetch a view for ajax you have to return the view as data

http://ellislab.com/codeigniter/user-guide/general/views.html (bottom of the page)

Like this

$view = $this->load->view('includes/templates/main_page_template', $data, true);
echo $view;

This will send the rendered view to the browser




回答2:


Put this code in view file

    <input type="hidden" name="siteurl" id="siteurl" value="<?php echo site_url(); ?>">
    <input type="hidden" name="baseurl" id="baseurl" value="<?php echo base_url(); ?>">

Then get hidden value in your script

var site_path = $("#siteurl").val();    
var base_path = $("#baseurl").val();

 $.ajax({
                    type: "post",
                    url: site_path+"account/profile/voteMe",....


来源:https://stackoverflow.com/questions/16970840/how-to-mesh-codeigniter-with-ajax

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!