Php + codeigniter + framework7

Questions
1

i am using php and codeigniter.

This is App controller

// when you type url like '/app', you come here
public function index(){ 
	$this->appList();
}

This is my Controller and index function

This is function appList() in controller.

$this->load->view('home/app/v2/includes/header', $header);
$this->load->view('home/app/v2/pages/loading',$myData);
$this->load->view('home/app/v2/includes/footer',$footer);

this is loading.php.

<div class="view view-main">
  <div data-name="home" class="page">
    loading...
  </div>
</div>

In app.js( loaded in the footer.php)
i wrote like this.
스크린샷 2020-03-24 오후 6.38.46

i cannot get data from async.

so we redirect ‘/app’ like below

var mainView = app.views.create('.view-main',{
  reloadPages: true,
  allowDuplicateUrls: true,
  // unloadTabContent : false,
});
mainView.router.navigate('/app', {
  ignoreCache  : true,
  reloadCurrent : true
});

then we can get data from async.

But,
when i try to use ‘Views as Tabs’ (https://framework7.io/docs/tabs.html#views-as-tabs),
all html goes into <div class=view view-main"> we made in loading.php(view)

This is main.php(view)

<div id="view-home" class="view view-main tab tab-active">
     ...
 </div>
 <!-- Catalog View -->
 <div id="view-catalog" class="view tab">
        ...
 </div>
 <!-- Settings View -->
 <div id="view-settings" class="view tab">
        ...
 </div>

(result)

<div class="view view-main">
     <div id="view-home" class="view view-main tab tab-active">
        ...
      </div>
      <!-- Catalog View -->
      <div id="view-catalog" class="view tab">
        ...
      </div>
      <!-- Settings View -->
      <div id="view-settings" class="view tab">
        ...
      </div>
</div>

but we want like below
(the html we want)

<div class="view view-main">
</div>
<div id="view-home" class="view view-main tab tab-active">
        ...
</div>
<!-- Catalog View -->
<div id="view-catalog" class="view tab">
        ...
 </div>
 <!-- Settings View -->
<div id="view-settings" class="view tab">
        ...
</div>

can i use php with framework7?
please help T.T
Thank you everyone~~~

2

Hey, have you had a fix yet? I am also trying to work with this (codeigniter 4 + framework7) but no luck. Any type of help would be appreciated.

3

If I am not mistaken I think you didn’t understand the concept of a PWA.

The idea is that the server doesn’t render the client, which is usually the case with PHP or php frameworks.

So how do PWA usually work. The browser of a client or in case of cordova/phonegap/electron/ionic apps, the Smartphone does all the UI rendering and the backend or the server only provides data

so how could this work with codeigniter?

Codeigniter would have to return data in json format so that the client can work with it.
The controller function could look like that:

//controller function

public function signin() {
    $arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);    

   //add the header here
    header('Content-Type: application/json');
    echo json_encode( $arr );
}

and in the front end you would have to make an ajax request to get the data.

2 Likes
4

Use codeigniter to make a api restfull to provide data in json to the pwa or móvil app developed in f7, for the backend can use ci4 too.

5

yes, it is right

but i use ci4 in different way.

6

How you use ci4? Explain a lit

7

i use ci4 not only to make api restful
but also to make client page.

I know usually npm or framework7 cli would make client view(like javascript page) and ci4 for backend(api)
but I also use ci4 to make client view like php website(maybe you know).

In ci4, i make controller for framework7 index page and then also make other ci4 client page with framework7 like php website

can you understand it?
If someone wants to know about the details, I can make video or article for them.

Thanks, framework7

8

You are using ci4 the right way, serving data in json to be consumed in f7. If the frontend for mobiles you can do it in f7 and the backend you can do it with the ci4 either the part of the api and the administration panel of the app or web app