CodeIgniter Forums
Undefined Variable when calling method with AJAX - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Undefined Variable when calling method with AJAX (/showthread.php?tid=26321)

Undefined Variable when calling method with AJAX - El Forum - 01-11-2010

[eluser]sico87[/eluser]
Hello,

I am currently working on a system that allows the user to upload their own background images, they do this by clicking on a textual link and the link calls a method via some jQuery ajax, the method searches the database for the image id that matches the ID that was sent in the URI, and then returns an image name. However when I try and alert the results in the success function of my ajax I can an undefined warning, below is my code

The view:

Code:
<div id="background-select">
    &lt;?php
    $count = 0;
        if(isset($special)) {
            foreach ($special as $row) {
                $count ++;
                print '<div class="select">';
                    print "<a class='background_btn' href='index.php/home/set_background/".$row['>$count</a>";
                print '</div>';    
            }
        }
        if(isset($generic)) {
            foreach ($generic as $row) {
                $count ++;    
                print '<div class="select">';
                    print "<a class='background_btn' href='index.php/home/set_background/".$row['>$count</a>";
                print '</div>';

                }
                
            }
        
        if(isset($user_background)) {
            foreach ($user_background as $row) {
                $count ++;
                print '<div class="select">';
                    print "<a class='background_btn' href='index.php/home/set_background/".$row['>$count</a>";
                print '</div>';
                }            
            }
    ?&gt;
    
</div>


<div id="wrapper">

The method that is called is the "set_background", which is this code,

Code:
public function set_background() {
        $this->load->model('image_model');
        if($query = $this->image_model->get_background_by_id($this->uri->segment(3))) {
            //die(var_dump($query));
            foreach ($query as $row) {
                $data['background'] = $row['background_name'];
            }
        }
        $this->load->view('template/background-select', $data);
    }

the ajax,
Code:
$("a.background_btn").click(function(ev){
    ev.preventDefault();
    alert("Hello");
    var url = $(this).attr("href");
    //alert(url);
    $.ajax ({
        url : url,
        type: "POST",
        success : function (html) {
         alert(&lt;?php echo $background ?&gt;)
        }
    })
});

and finally the code the controller calls in the model,

Code:
public function get_background_by_id($background_id) {
        $this->db->select('background_name');
        $this->db->from('background');
        $this->db->where('background_id', $background_id);
        $this->db->limit(1);
        
        $query = $this->db->get();
        return $query->result_array();
    }

Can anyone tell me why the $background variable that is being sent to the view via the $data array is being returned as undefined am I so confused.

Thanks

Undefined Variable when calling method with AJAX - El Forum - 01-11-2010

[eluser]Sbioko[/eluser]
You need to echo your $background var in the view and in JavaScript in your success callback do this:
Code:
alert(html);


Undefined Variable when calling method with AJAX - El Forum - 01-11-2010

[eluser]sico87[/eluser]
Can I not do it in the javascript I was hoping I could do something like this in my success,

Code:
$('#wrapper').css('background', 'url(/media/uploads/backgrounds/&lt;?php echo $background' ?&gt;)');


Undefined Variable when calling method with AJAX - El Forum - 01-11-2010

[eluser]Sbioko[/eluser]
Read docs about jQuery.ajax. There are no direct acess to $(jQuery) in your success callback. So does it work?

Undefined Variable when calling method with AJAX - El Forum - 01-11-2010

[eluser]Dyllon[/eluser]
You're returning a view (HTML) in your set_background method and trying to alert a php variable in your jquery, that's not going to work.

Your method is returning HTML which you'll see if you alert the html

Code:
$("a.background_btn").click(function(ev){
    ev.preventDefault();
    alert("Hello");
    var url = $(this).attr("href");
    //alert(url);
    $.ajax ({
        url : url,
        type: "POST",
        success : function (html) {
         alert(html)
        }
    })
});

But that's a really frustrating and inefficient way to debug JS, if you don't already have it get firefox and install the firebug add-on it will make your life alot easier.