jQuery Mobile PHP MVC Framework

I’ve released an update to this, check out the blog post for more details!

In my Introduction to jQuery Mobile, I mentioned that I had plans for a simple MVC framework using jQuery Mobile and that I would release it if there was enough interest (there was!). While it’s not completely finished yet, I’ve decided to release it in hopes that others find use in it and can perhaps even contribute towards it’s development.

Preview and Download

You can view the files or contribute at the Github repository. The code is released under GPL so use it however you’d like!

Download Files (zip)View Online Demo

Current Features

  • MVC Architecture
  • Simple Database (MySQL) and Authentication Classes
  • Custom routing for clean URLs
  • Apache (.htaccess), NGINX and Lighttpd support

Configuration

Please read this part, as it is crucial to getting the application to work on your test machine. You must manually edit the config.php file with, at the least, your database information/credentials and the BASE_URL of the installation. The app will not work without these two settings.

/lib/config.php:

1
2
3
4
5
6
7
8
9
10
11
12
13
...
// Be sure to set these!
define("BASE_URL","http://localhost/jqmobile/");
define("COOKIE_DOMAIN","localhost");

// Database Config
$database = array (
    "user"  => "root",
    "pass"  => "",
    "host"  => "localhost",
    "dbname" => "jqmobile"
);
...

Work in Progress

Please be aware that this code is still in development and is likely to have bugs that need fixing. It is by all means beta-ware and I wouldn’t recommend using it in a production environment as-is. That said, it should still provide you with a solid base to build your mobile application from, so download the files and dig in! If you are interested in contributing to the code, please get in touch via the contact page or Github.

For more articles and resources like this, be sure to Subscribe to our RSS Feed and Follow us on Twitter!

Enjoyed the post?

Then you should follow me on Twitter or subscribe to the RSS feed.

  • Pingback: jQuery Mobile PHP MVC Framework

  • Pingback: Collective: jQuery Mobile PHP MVC Framework | Codrops

  • http://codeforest.net Codeforest

    Wow, this is really something.

    I noticed one small bug on the demo. If you submit empty register form, error is shown as it is supposed to, but the Back is not working (in app not browser)

    BTW, I intend to try this, maybe write a tutorial around it on my blog (with credentials, of course).

    Thanks

  • Pingback: Collective: jQuery Mobile PHP MVC Framework « Theory Code

  • Pingback: Tweets that mention Simple jQuery Mobile PHP MVC Framework | DevGrow -- Topsy.com

  • Pingback: MVC Framework para aplicaciones moviles | Eliseos.net

  • Pingback: MVC Framework para aplicaciones moviles | Slice My Dreams

  • http://www.mamiaro.com.ar pablo

    Thanks friend : )

  • http://ramnathbabu.com ramnath

    welcome this.. will contribute to this is possible :)

  • Pingback: Tutto su mobile — Studio404 Web Agency

  • http://www.mcgwebdevelopment.com/ Matthew

    Your buttons in the footer return “404″ errors. A trailing slash “/” after the URLs should fix it.

  • Pingback: jQuery Mobile PHP MVC Framework

  • http://www.viennaopenminds.at thomas

    This a really nice introduction to jquery, but I’ve got a little problem. I installed it on my webserver in the directory myURL/jquery. I get the first page, but when I click on a button (doesn’t matter wich one) it always says: “Error loading page”. I’m not sure about the COOKIE_DOMAIN? Can that be the problem?

  • Pingback: jQuery Mobile PHP MVC Framework » Onur Aydemir | Web Koçu

  • Wartex

    Amazing! Thx for publishing it. I have a question: i get always the same error: “Error loading page”. (ofcourse: Apache mod_rewrite is loaded)

    Can you help me?

  • http://www.idrisweb.com idrisweb

    I have the problem “Error loading page” on Windows7.
    Thanks for your reply !

  • wHiTeHaT

    I have all up and running and can navigate to all pages.
    However i cant register?
    Database and its table is created and all fields are there.
    But ofcourse no user data is inserted.

  • http://www.softboxcommunity.com Cilsilver

    I mean, this is a wonderful concept. I went through th site and still find everything lovely. I will like you to be a contributor to my community site though still working on the concept. Good work on this MVC. I’m buying into it

  • wHiTeHaT

    I getting lots of errors and registration dont work.

    see here: http://tinyurl.com/3kjmvlu
    i enabled error reporting so you can see what is happening.
    i realy hope these issue’s can be solved.

  • wHiTeHaT

    i changed directory and updated to latest 1.04 jquerymobile and 1.5X jquery

    now i managed to register…but page dont continue.
    If browse back i see i’m logged.
    The errors still remaining (php code).

    Url changed: http://tinyurl.com/3kkn8tb

    • padde

      Just take this constructor for the users model:

      function __construct(){
      global $db;

      $this->user_id = 0;
      $this->email = “Guest”;
      $this->name = “Guest”;
      $this->ok = false;

      if(!isset($_SESSION['auth_email'])) $_SESSION['auth_email'] = ”;
      if(!isset($_SESSION['auth_secret'])) $_SESSION['auth_secret'] = ”;

      if(!isset($_COOKIE['auth_email'])) setcookie(‘aut_email’, ”);
      if(!isset($_COOKIE['auth_secret'])) setcookie(‘auth_secret’, ”);

      if(!$this->check_session()) $this->check_cookie();

      return $this->ok;
      }

      You cant check an unset session rather than a cookie. so if is not set set it to empty which is the condition for further tests!

  • wHiTeHaT

    Most issue’s fixed by upgrading my apache to 5.3.X
    Only some problems left with the navigation.

    I’m using:
    jquery.mobile-1.0a4.1.min.css
    jquery-1.5.2.min.js
    jquery.mobile-1.0a4.1.min.js

    JQM did some changes to the navigation methode’s and buttons.

    So for those where it not work…. use php 5.3.X

    • Jay

      Hi wHiTeHaT,

      Please can you help me to solve “Error Loading Page” issue ?

      Thanks in advance.

      Jaydeep

  • alex

    I’m trying now the framework, I really like it, thanks for your work.
    I have the same problem as the guys above, I think to look into mod_rewrite for Apache to call when a URL is not redirected to the index.php. tips?

  • padde

    If got problems with undefined variables at startup change the route function to this:

    function route($uri){
    $uri = $this->check_pages(explode(‘/’,$uri));
    $model = $uri[0];
    if($model && $model != “index.php”){

    $action = $uri[1] ? $uri[1] : ‘index’;
    $var = $uri[2];
    $var2 = $uri[3];
    $var3 = $uri[4];

    if($model == “page”){
    $page = new Page;
    $page->load_page($action);
    }elseif(file_exists(LIB_DIR.’/controllers/’.$model.’.php’)){
    $$model = new $model;
    if(method_exists($$model,$action)) $$model->$action($var, $var2, $var3);
    else Home::error();
    }else Home::error();
    }else Home::index();
    }

    Just assing $action + $var* in the if statement where you check that the called model is not index.php …

  • Suresh

    Wow, this is really good job.
    thanx a lot.

  • lolcat

    How can i change the title of each page?

  • http://www.safecycle.net Trevor Cutrer

    Has any more contributive progress been made? Source forks?

  • http://www.toughtomato.com Martin

    Thanks for the great resource! I’m trying this on JQM 1.0b1 and jQ 1.6.1 and the back links don’t work. Do you know what might be the problem here? Thanks

    • http://www.toughtomato.com Martin

      Thanks, you can enable them using:
      $(document).bind(“mobileinit”, function() {
      // enable ‘back’ buton in header
      $.mobile.page.prototype.options.addBackBtn = true;
      });

  • whitehat

    Backlinks are disabled by default in jqm 1.0b1

  • MATLEPIRATE

    Hi,
    Great app, I have an “Error loading page” on all links with JQM 1.0b1 and jQ 1.6.1,
    the problem is that the template is not usable on all the website
    my server is mod-rewrite apache2 php 5.3

    One more question, if the user login, the app could save his personnal feeds and open again in another session ?
    Thanks
    Kind regards
    Mat

  • http://www.loveludhiana.org/ Aman

    Hi,

    Its very good source for beginners like me. I have downloaded the code. will test it soon.

  • http://jsureshkumar.blogspot.com suresh

    hi, i have just made the jqmobile setup (on Linux Machine )
    the setup went fine. I have a problem . when i click on the register button, the form comes up, but the url changes from
    ” http://localhost/jqmobile” to “http://localhost/jqmobile/#./user/register” .
    how to correct this..?

  • _jkruse_

    Hi,

    I’ve the same problems like wHiTeHaT. When I want to register no data is inserted into database.
    Is there a solution to solve this problem?

  • Pingback: Collective: jQuery Mobile PHP MVC Framework | Templates, Scripts, CMS, Graphics, Fonts, Flash, E-Books, 3D, Tutorials, Wallpapers.

  • ghd214

    good job.

    but I hava a 404 error.

  • Pingback: jQuery Mobile PHP MVC Framework « Impossible Thoughts

  • Spizzico

    Sorry, but .sql for db?

  • http://www.rayit.com Raymond Marx

    Many thanks for this super contribution to the world of php.

    Think it’s not only perfect for mobile bus also as basis for every php project!

    Again many thanks

  • Rob

    Great job! This code is teaching me a lot about OO PHP programming.

    Avoid ‘error loading page’ by changing the links
    in home.php :

    Register
    Login

    Pages:
    About
    Terms of Service

    Next you will be most likely to see ‘undefined’ instead of the forms when you click one of the links.
    You can fix this by formatting the referred pages correctly.
    (login.php)

    Login

    Please login to view your order status or support requests.

    E-mail Address:

    Password:

  • nguyenhieptn

    I got everything working fine except this smalll error.

    After I login/register, the form redirect to home site. and there still hash
    http://192.168.1.229/expmobile/#./user/login

    so when I click to any menu here (logout/profile) the page can not be load because it will add
    http://192.168.1.229/expmobile/#./user/login./user/logout

    And page can not be found.

    can some one explain how the routing working ? it may help to fix this problem.

    Thanks

  • http://www.schoolib.com Graham

    All the errors in this app are supressed. How to see the php runtime errors while development.

    • Nguyenhieptn

      You need firefox with firebug plugin, then navigate to console look at the ajax respond

  • Matt

    This is pretty cool. However, releasing it under the GPL it makes it pretty hard to use in a commercial setting.

  • Xavier

    Hello,
    this project is really great.
    However I have a few questions and issues.

    1) Will I be able to use it for a commercial application? For free without any requirement?
    2) I’m trying to use the JQM stable version 1.0, there is a problem with the footer links not displaying in buttons as it should and there is no back button on pages to go back to home.
    3) A tutorial would be really appreciated.
    4) If I can help translating in french…

    Thanks a lot!

  • Xavier

    I just added to issues and solutions to fix the
    missing back button in header
    missing button style to footer links
    on github

  • Pingback: knowDB

  • http://developer mayasakthi

    Hi,

    I have new jquery mobile website. I have download and install my local machine. and change confiq. But I got “Internal Server Error”. Suppose i will using this architecture all mobile are support this.. Please let me working fine for all mobile and let me any one how to this error.

    • Sharkkr

      same problem

      • Chandima

        Make sure, that the apache server has the rewrite module (mod_rewrite) included in the config.

    • Martin Zeitler

      that’s coming from .htaccess, most likely.
      That might be wrapped that around the directives:

      Alternatively you could just install/enable the missing Apache module(s).

  • sagaz

    Por ahora va bien, he conectado sin problemas. Gracias

  • Sagette Alexandre

    it sounds great ! I’m eager to see more :-)

  • Chandima

     Latest release seems to have a path configuration problem. Though the mentioned configuration settings are done, paths are not identified properly. Please fix this and upload it.

  • Jukooz

    There is error on demo page: “Notice: Undefined index: auth_email in
    /home/www/devgrow.com/public_html/examples/jquery-mobile-mvc/lib/models/user.php
    on line 170

    Notice: Undefined index: auth_secret in
    /home/www/devgrow.com/public_html/examples/jquery-mobile-mvc/lib/models/user.php
    on line 170″

  • Pingback: Project | Pearltrees

  • Pingback: jQuery Mobile PHP MVC Framework | Günlük Haftalık Aylık

  • Pingback: Risorse, tutorial, tool, framework e Wordpress per Mobile | Flashmotus

  • Pingback: Morozov Blog

  • Aaron

    I clicked view online demo, it returned “An error has occurred”??