Question

I am building an HTML mobile app using Jquery Mobile. Its amazing so far.

However, In building my dynamnic template, I ran into a bit of a snag.

Heres my controller:

function index()
{
        $data['page'] = "home";
        $page['head'] = $this->load->view('template/head',$data,TRUE);
        $page['header'] = $this->load->view('template/header', $data, TRUE);
        $page['footer'] = $this->load->view('template/footer', $data, TRUE);
        $page['nav'] = $this->nav($data['page']);
        $this->load->view("pages/home", $page);
}

function nav($page)
{
        $data['page'] = $page;
        $page['header'] = $this->load->view('template/header', $data, TRUE);
        $page['footer'] = $this->load->view('template/footer', $data, TRUE);
        return $this->load->view('template/nav',$page,TRUE);
}

Regardless as to why I have it set up this way, any reason why, within the function nav($page) the view would return Undefined variable: header and Undefined variable: footer errors?

Answer 1

It’s because you’re trying to overwrite a string based variable with an array index.
You’re passing in $page to the method, but then trying to create an array called $page to pass to the view. You need to rename the array to pass to the view:

function nav($page)
{
    $data['page'] = $page;

    // you should rename the array to pass to the view (from $page to $my_page)
    $my_page['header'] = $this->load->view('template/header', $data, TRUE);
    $my_page['footer'] = $this->load->view('template/footer', $data, TRUE);
    return $this->load->view('template/nav',$my_page,TRUE);
}