JS three-level linkage (for better ideas)

Source: Internet
Author: User

First look at the interface:

When it comes to select linkage, I think of using AJAX to get the data loaded.

Then began to write, select is changed, trigger Ajax to go backstage to find data, the data to their own sub-classification data and the current selection of classification of commodity data.

After writing, found that some duplicate code, get the product of this data, interface and JS get the data Loop traversal code a number of repetitions, triggered three selection box event, all to obtain the corresponding classification of the product data, so to pull out.

Front-end JS code:

First selection box:

$ ("#pcate"). Change (function () {var pcate = This.value;                 $.getjson (' {php echo webUrl ("Order/print/ajaxccate")} ', {pcate:pcate},function (res) {if (Res.status = = 0) {                var data = Res.result;                 var html = ' <option value= ' "selected> all </option> '; if (Data! = ") {$.each (data,function (index, category) {html + = ' <option val                     Ue= "' + category[' id '] + '" > ' + category[' name ' + ' </option> ';                 })} getgoods ();                 $ ("#ccate"). HTML ("");                 $ ("#ccate"). HTML (HTML);             $ ("#tcate"). HTML ("<option value=" selected> all </option> ");                  }else{$ ("#ccate"). HTML ("<option value=" selected> all </option> ");                  $ ("#tcate"). HTML ("<option value=" selected> all </option> "); $ ("#title"). HTML ("<option VALue= "selected> all </option>"); }         })     })

Second selection box:

$ ("#ccate"). Change (function () {         var ccate = this. Value;         var pcate = $ ("#pcate"). Val ();         $.getjson (' {php echo webUrl ("Order/print/ajaxtcate")} ', {ccate:ccate,pcate:pcate},function(res) {             if ( Res.status = = 0) {                 var data = Res.result; var html = ' <option value= ' selected> all </option> '  ; if (Data! = ") {$.each (data,function (index, category) {html + = ' <option value=" ' + category[' id ') + ' "> ' + category[' name '] + ' </option> ';}) } getgoods (); $ ("#tcate"). HTML (""); $ ("#tcate"). HTML (HTML);} else{getgoods (); $ ("#tcate"). HTML ("<option value=" selected> all </option> ")})  

Third selection box:

$ ("#tcate"). Change (function () {         getgoods ();           })

Get Product:

function Getgoods () {        var p = $ ("#pcate"). Val ();        var C = $ ("#ccate"). Val ();        var t = $ ("#tcate"). Val ();        $.getjson (' {php echo webUrl ("Order/print/getgoods")} ', {tcate:t,pcate:p,ccate:c}, function(res) {            if ( Res.status = = 0) {var data = Res.result; var html = ' <option value= ' "selected> all </option> '; if (Data! = ") {$.each (data,function (index, category) {html + = ' <option value=" ' + category[' id ') + ' ">" + category[' title ' + ' </option> ';}) } $ ("#title"). HTML (""); $ ("#title"             

Background interface:

Public functionAjaxccate () {Global $_gpc,$_w; $pcate = intval ($_gpc[' pcate ']); if (Empty ($pcate) {return Show_json (1); } $ccate = Pdo_fetchall (' SELECT name,level,id from '. TableName (' Ewei_shop_category '). ' WHERE Uniacid =: uniacid and parentid =:p Arentid and level = 2 ORDER by Displayorder DESC ', Array (': Uniacid ' =>$_w[' Unia Cid '], ':p arentid ' = $pcate)); Show_json (0, $ccate); } public functionAjaxtcate () {Global $_gpc,$_w; $ccate = intval ($_gpc[' ccate ']); if (empty ($ccate)) return Show_json (1); $tcate = Pdo_fetchall (' Select Name,id from ' tablename (' ewei_shop_category ') ).‘ where uniacid =: uniacid and parentid =:p Arentid and level = 3 ORDER BY displayorder Desc ', Array (': Uniacid ' =>$_w[' Unia Cid '], ':p arentid ' = $ccate)); Show_json (0, $tcate), Public function Getgoods () {global $_gpc,$_w; $con = "; $tcate = intval ($_gpc[' TCA Te ']); $pcate = intval ($_gpc[' pcate ')), $ccate = Intval ($_gpc[' ccate ')), if (!empty ($pcate)) $con. = ' and Pcate = '. $pcat e; if (!empty ($ccate)) $con. = ' and Ccate = '. $ccate, if (!empty ($tcate)) $con. = ' and Tcate = '. $tcate; $s QL = ' Select Title,id from '. TableName (' Ewei_shop_goods '). ' where Uniacid = '. $_w[' Uniacid ']. $con; $title = Pdo_fetchall ($sql); Show_json (0, $title);}  

JS three-level linkage (better thinking)

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.