3-level regional linkage based on database, PHP and Ajax

Source: Internet
Author: User

Before each to use the regional linkage is basically used by other people to write the JS to do multi-level linkage, but found the biggest drawback is that the region information is too old, and inconvenient to update.
Today in the online search to 2015 the latest National Geographic information data, it is intended to use the database with Ajax to do linkage, the background can also be very convenient data update

Code 1 (jquery code, which is responsible for the AJAX data linkage preceding paragraph):

<divclass="Form-group"><labelfor ="province">Provinces 
     Label
 ><Selectclass="Form-control"id="province"  Name="province"><optionvalue ="" > 
     Option
 >Volist is the label of thinkphp, here I use the thinkphp framework to write code, automatically loaded into the provincial area information<volistname="province"id="Vo"><optionvalue ="{$vo. class_id}" >{$vo. class_name} 
     Option
 > 
     volist
 > 
     Select
 ><labelfor =' city '>City 
     Label
 ><Selectclass="Form-control"id="City"name ="City"> 
     Select
 ><labelfor ="County">County District 
     Label
 ><Selectclass="Form-control"id="County"name=" County "> 
     Select
 > 
     Div
 ><script>$ (document). Ready ( function(){//Provincial data changes$("#province"). Change ( function(){$.post ('/home/creat/ajax ', {province:$ ("#province"). Val ()}, function(data){//alert (' successful post back Data ');if(Data.info = =' OK ') {//Returns OK, assigns the city drop-down box to the value//alert (data.content);Col_clear (' City '); Col_add (' City ', data.content); $("#city"). Change (); }Else{alert (data.info); }            },' JSON '). Error ( function(){Alert"Network connection error, please try again later");    }); });//City Data changes$("#city"). Change ( function(){$.post ('/home/creat/ajax ', {city:$ ("#city"). Val ()}, function(data){if(Data.info = =' OK ') {Col_clear (' County '); Col_add (' County ', data.content); }Else{alert (data.info); }            },' JSON '). Error ( function(){Alert"Network connection error, please try again later");    }); });});//select Method of Operation//Add functioncol_add(id,data) {varSelobj = $ ("#"+ID); for(varI=0; I
   
    
    
 ""

   +data[i].class_name+""); }}//Delete functioncol_delete() {varSelopt = $ ("#mySelect option:selected");  Selopt.remove (); }//Clear functioncol_clear(id) {varSelopt = $ ("#"+id+"option");  Selopt.remove (); } 
     Script
 >

Code 2 (PHP back-end data to determine the interaction code, based on thinkphp write, if it is the other framework, the same principle, the code will be some deserted into):

 Public functionajax(){$city= M (' City ');if(!is_ajax) {$this->ajaxreturn (Array(' Info '=' Illegal request method ')); }//If the province is submitted to the changeif(I (' Post.province ',0,' Intval ')){$filter=Array(' class_parent_id '= I (' Post.province ',0,' Intval '),' Class_type '=2);$data[' content '] =$city->where ($filter)->select ();$data[' Info '] =' OK '; }//If a city change is submitted.if(I (' post.city ',0,' Intval ')){$filter=Array(' class_parent_id '= I (' post.city ',0,' Intval '),' Class_type '=3);$data[' content '] =$city->where ($filter)->select ();$data[' Info '] =' OK '; }$this->ajaxreturn ($data); }

Finally, the database, the contribution of their own database, according to the January 2015 country published regional information is written, is the latest.

SQL database Download

'). addclass (' pre-numbering '). Hide (); $ (this). addclass (' has-numbering '). Parent (). append ($numbering); for (i = 1; i <= lines; i++) {$numbering. Append ($ ('
  • '). Text (i)); }; $numbering. FadeIn (1700); }); });

    The above describes the database, PHP, AJAX 3-level regional linkage, including the aspects of the content, I hope that the PHP tutorial interested in a friend helpful.

  • Related Article

    Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.