Avatar of danz67
danz67
Flag for Italy asked on

WebApp for Mobile

Good day and season's greetings to all,

I would like to create a WebApp for mobile devices, I have seen many ways to do this, jQTouch, jQuery Mobile, and others.
I need some advice on which is the best solution for performance and ease of use.
I also need a simple example of how to display data from a table in a list and see the detail in another view where I can modify, delete and / or add a record.
The table structure is:

CREATE TABLE `customers` (
  `CustomerID` varchar(5) NOT NULL,
  `CompanyName` varchar(40) NOT NULL,
  `ContactName` varchar(30) DEFAULT NULL,
  `ContactTitle` varchar(30) DEFAULT NULL,
  `Address` varchar(60) DEFAULT NULL,
  `City` varchar(15) DEFAULT NULL,
  `Region` varchar(15) DEFAULT NULL,
  `PostalCode` varchar(10) DEFAULT NULL,
  `Country` varchar(15) DEFAULT NULL,
  `Phone` varchar(24) DEFAULT NULL,
  `Fax` varchar(24) DEFAULT NULL,
  PRIMARY KEY (`CustomerID`),
  KEY `City` (`City`),
  KEY `CompanyName` (`CompanyName`),
  KEY `PostalCode` (`PostalCode`),
  KEY `Region` (`Region`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

Open in new window

PHPjQueryResponsive Web

Avatar of undefined
Last Comment
Ray Paseur

8/22/2022 - Mon
IanTh

a web designer mate of mine uses jqueary mobile to great affect
danz67

ASKER
thanks for the reply but I need more information and code examples with MySql
ASKER CERTIFIED SOLUTION
mcnute

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
Ray Paseur

You probably want to start with the simplest "Hello World" kind of application, and then build up from that.  This article will help you get started with the jQuery interface to the backend script (this is called AJAX), and the book will help you get an understanding of how PHP and MySQL play together.
https://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/A_10712.html
http://www.sitepoint.com/books/phpmysql5/

Note that MySQL has now been officially deprecated by PHP.  A better choice might be MySQLi or PDO.
http://us2.php.net/manual/en/mysqlinfo.api.choosing.php
Your help has saved me hundreds of hours of internet surfing.
fblack61
danz67

ASKER
<?php
$link = mysql_connect('localhost', 'your_user', 'your_pw');
mysql_set_charset('utf8',$link); 

if (!$link) {
    die('Verbindung schlug fehl: ' . mysql_error());
} else {
   // echo "connection is super!". $link;
}

$selectdb = mysql_selectdb('your_db', $link);


$sql = "select * from customers limit 0,10"; // you may want to limit the results for big tables to the firs 10 by adding LIMIT 0,10 at the end of the query.
$result = mysql_query($sql);
?>
<!DOCTYPE html> 
<html> 
<head> 
	<title>Customers</title> 
	
	<meta name="viewport" content="width=device-width, initial-scale=1"> 

	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
	<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head> 
<body> 

<div data-role="page" id="one">

	<div data-role="header">
		<h1>Select Customer</h1>
	</div><!-- /header -->

	<div data-role="content">	
		<h2>Get Customer Profile:</h2>
  	<ul data-role="listview" data-inset="true">
	<?php
	$html;
	while ($r = mysql_fetch_object($result)) {
		echo '<li><a href="#customer'.$r->id.'">Customer '.$r->id.' Profile</a></li>';
		$html .= '<div data-role="page" id="customer'.$r->id.'" data-theme="a">

		<div data-role="header">
			<h1>Customer '.$r->name.'</h1>
		</div><!-- /header -->
	
		<div data-role="content" data-theme="a">	
			<h2>Customer '.$r->name.'</h2>
			<p>display here the customer information.</p>	
			<p><a href="#one" data-direction="reverse" data-role="button" data-theme="b">Back to page "one"</a></p>	
			
		</div><!-- /content -->
		
		<div data-role="footer">
			<h4>Page Footer</h4>
		</div><!-- /footer -->
		</div>';
	}
	?>
	</ul>	
	</div><!-- /content -->

	<div data-role="footer">
		<h4>Page Footer</h4>
	</div><!-- /footer -->
</div><!-- /page -->
<?php
echo $html;
?>

</body>
</html>

Open in new window


Thank you for the code you've provided, I was able to optimize it to display data in list and detail.
To complete, as I asked in the question, how do I modify, delete and / or add a record? Make a small effort for me :) thanks
Ray Paseur

There really isn't an answer short of writing your application for you and since I'm a professional programmer I can't do that for free.  But the SitePoint book will teach you everything you need to know to get started.