php+javascript 3段階連動を実現
4185 ワード
3段階の連動を実現して、私は地区のデータソースを採用してmysqlデータベースの中で格納して、このようにバックグラウンドの構成データを便利にして、それからデータをデータベースの中から読み出して、データをjsonフォーマットに保存して1つのjsファイルに書き込んで、jsコードを通じてjsonフォーマットのデータを処理してそして連動ボックスの中で表示します.
まずデータベースアーキテクチャとテストデータとphpファイルとjsonフォーマットファイルを提供し、jsはjsonデータファイルを処理して数日後に提供し、最近少し忙しいです.
phpファイル
以上がデータを扱うファイルです.jsに書き込むjsonファイルスタイルは次の表の通りです.
データベース・ファイル構造とテスト・データの提供
-- phpMyAdmin SQL Dump-- version 3.3.7--http://www.phpmyadmin.net----ホスト:localhost--生成日:2011年07月14日15:28--サーババージョン:5.0.90--PHPバージョン:5.2.14
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;/*!40101 SET NAMES utf8 */;
----データベース:`area`--
-- --------------------------------------------------------
----表の構造`areas`--
CREATE TABLE IF NOT EXISTS `areas` ( `id` int(11) NOT NULL auto_increment, `area_id` int(11) default NULL, `area_name` varchar(40) default NULL, `parent_id` int(11) default NULL, `pinyin` varchar(40) default NULL, PRIMARY KEY (`id`)) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;
---転送テーブルのデータ`areas`--
INSERT INTO `areas` (`id`, `area_id`, `area_name`, `parent_id`, `pinyin`) VALUES(1, 33, 'zhejiang', 0, 'zhejiang'),(2, 3301, 'hangzhou', 33, 'hangzhou'),(3, 330101, 'xihuqu', 3301, 'xihuqu'),(4, 330102, 'binjiangqu', 3301, 'binjiangqu'),(5, 3302, 'ningbo', 33, 'ningbo'),(6, 330201, 'beilunqu', 3302, 'beilunqu'),(7, 330202, 'yinchengqu', 3302, 'yinchengqu'),(8, 34, 'shandong', 0, 'shandong'),(9, 3401, 'jinan', 34, 'jinan'),(10, 340101, 'lixiaqu', 3401, 'lixiaqu'),(11, 340102, 'lichengqu', 3401, 'lichengqu'),(12, 3402, 'qingdao', 34, 'qingdao'),(13, 340201, 'sifangqu', 3402, 'sifangqu'),(14, 340202, 'laoshanqu', 3402, 'laoshanqu');
私が使っているフレームワークはcodeigniterです.関連クラスライブラリと資料を参照してください.
著者:ギャングスポーツ創業者高学平
まずデータベースアーキテクチャとテストデータとphpファイルとjsonフォーマットファイルを提供し、jsはjsonデータファイルを処理して数日後に提供し、最近少し忙しいです.
phpファイル
class Start extends CI_Controller
{
function __construct()
{
parent::__construct();
$this->load->database();
}
function cas()
{
$res = $this->db->get('areas')->result_array();
foreach($res as $key => $value)
{
if($value['parent_id'] == '0')
{
$arr['province'][$value['area_id']] = $value['area_name'];
}
}
foreach($res as $key => $value)
{
foreach($arr['province'] as $k => $val)
{
if($k == $value['parent_id'])
{
$arr['city'][$value['area_id']] = $value['area_name'];
}
}
}
foreach($res as $key => $value)
{
foreach($arr['city'] as $k => $val)
{
if($k == $value['parent_id'])
{
$arr['area'][$value['area_id']] = $value['area_name'];
}
}
}
$jsroot ='./js/area.js';
$str = 'var data = '.json_encode($arr);
file_put_contents($jsroot,$str);
// var_dump($arr);
}
}
以上がデータを扱うファイルです.jsに書き込むjsonファイルスタイルは次の表の通りです.
var data = {
"province" : {
"33" : "zhejiang",
"34" : "shandong"
},
"city" : {
"3301" : "hangzhou",
"3302" : "ningbo",
"3401" : "jinan",
"3402" : "qingdao"
},
"area" : {
"330101" : "xihuqu",
"330102" : "binjiangqu",
"330201" : "beilunqu",
"330202" : "yinchengqu",
"340101" : "lixiaqu",
"340102" : "lichengqu",
"340201" : "sifangqu",
"340202" : "laoshanqu"
}
}
データベース・ファイル構造とテスト・データの提供
-- phpMyAdmin SQL Dump-- version 3.3.7--http://www.phpmyadmin.net----ホスト:localhost--生成日:2011年07月14日15:28--サーババージョン:5.0.90--PHPバージョン:5.2.14
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;/*!40101 SET NAMES utf8 */;
----データベース:`area`--
-- --------------------------------------------------------
----表の構造`areas`--
CREATE TABLE IF NOT EXISTS `areas` ( `id` int(11) NOT NULL auto_increment, `area_id` int(11) default NULL, `area_name` varchar(40) default NULL, `parent_id` int(11) default NULL, `pinyin` varchar(40) default NULL, PRIMARY KEY (`id`)) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=15 ;
---転送テーブルのデータ`areas`--
INSERT INTO `areas` (`id`, `area_id`, `area_name`, `parent_id`, `pinyin`) VALUES(1, 33, 'zhejiang', 0, 'zhejiang'),(2, 3301, 'hangzhou', 33, 'hangzhou'),(3, 330101, 'xihuqu', 3301, 'xihuqu'),(4, 330102, 'binjiangqu', 3301, 'binjiangqu'),(5, 3302, 'ningbo', 33, 'ningbo'),(6, 330201, 'beilunqu', 3302, 'beilunqu'),(7, 330202, 'yinchengqu', 3302, 'yinchengqu'),(8, 34, 'shandong', 0, 'shandong'),(9, 3401, 'jinan', 34, 'jinan'),(10, 340101, 'lixiaqu', 3401, 'lixiaqu'),(11, 340102, 'lichengqu', 3401, 'lichengqu'),(12, 3402, 'qingdao', 34, 'qingdao'),(13, 340201, 'sifangqu', 3402, 'sifangqu'),(14, 340202, 'laoshanqu', 3402, 'laoshanqu');
私が使っているフレームワークはcodeigniterです.関連クラスライブラリと資料を参照してください.
著者:ギャングスポーツ創業者高学平