WEX5 the management of the actual combat delivery address (i)

Today to share with you is the actual combat project management delivery address, now a variety of e-commerce app management receiving address style more and more, the effect is getting better. There are several steps to this project:

1. The list iterates over the JSON data and initializes the default delivery address.

2, list data increase, delete, change, check.

First show, as follows:

650) this.width=650; "Src=" Http://s1.51cto.com/wyfs02/M01/8B/E1/wKiom1hbZ17RHT_oAACRB5oLRGY391.png-wh_500x0-wm_3 -wmp_4-s_2800483329.png "title=" 1.png "style=" width:300px;height:441px; "width=" height= "441" border= "0" hspace= "0" vspace= "0" alt= "wkiom1hbz17rht_oaacrb5olrgy391.png-wh_50"/> Chart one for Manage Addresses page

650) this.width=650; "Src=" Http://s5.51cto.com/wyfs02/M00/8B/DD/wKioL1hbZ17CJLJcAAA9bSlorSQ890.png-wh_500x0-wm_3 -wmp_4-s_2589919862.png "title=" 2.png "style=" width:300px;height:455px; "width=" height= "455" border= "0" hspace= "0" vspace= "0" alt= "wkiol1hbz17cjljcaaa9bslorsq890.png-wh_50"/> Figure II for the new increase in the address page

650) this.width=650; "Src=" Http://s5.51cto.com/wyfs02/M00/8B/E1/wKiom1hbZ12geTtbAABCl9NCZBQ036.png-wh_500x0-wm_3 -wmp_4-s_3710000933.png "style=" width:300px;height:462px; "title=" 3.png "width=" "height=" 462 "border=" 0 "hspace= "0" vspace= "0" alt= "wkiom1hbz12gettbaabcl9nczbq036.png-wh_50"/> Figure three for selecting urban areas

Detailed code is explained below:

1. Initialize the list data

Model.prototype.addressDataCustomRefresh = function (event) {

var addressdata = Event.source;

var url = require.tourl (url_window+ "/uapp/get_placeofreceipt.htm?jsoncallback=?");

var url = require.tourl ('./json/mangae.json ');

$.ajaxsettings.async = false;

$.getjson (url,function (data) {

Addressdata.loaddata (data);

});

};

and set the default address style in the page

650) this.width=650; "Src=" Http://s4.51cto.com/wyfs02/M02/8B/DD/wKioL1hbaGKwQlAoAAFkrEFbXf0736.png-wh_500x0-wm_3 -wmp_4-s_1028156.png "title=" 4.png "alt=" Wkiol1hbagkwqlaoaafkrefbxf0736.png-wh_50 "/>

The JSON format is:

[

{"id": "23442", "truename": "Sauce Burst", "mobile": "1340000000", "Telephone": "13516958451", "Areainfo": "Guangdong Province Shenzhen South Mt. District **********" , "Address_default": "0"},

{"id": "23432", "Truename": "Jiang Xiao Yu", "Mobile": "1340000000", "Telephone": "18815421236", "Areainfo": "Guangdong Province Shenzhen Baoan District Balcony Mountain", " Address_default ":" 1 "},

{"id": "23412", "Truename": "Tie Knife", "mobile": "1340000000", "Telephone": "15565487952", "Areainfo": "Guangdong Province Shenzhen Baoan District Xixiang Street Stone Street Village", "Address_default": "0"}

]

The implementation of the figure one effect is not difficult, see WEX5 Primary video can be completed, some projects in the interface data may not have the outer layer that [] brackets, it is necessary in the Customrefresh function, the first definition of the data [], on the Getjsonpush can be.

2, data processing.

New

Model.prototype.newaddressClick = function (event) {

var parems = {

ID: "",

Operator: "NEW"//set identity as edit or new address

}

var url = require.tourl ('./ADD_ADDRESS.W ');

Justep. Shell.showpage (Url,parems);

};

Edit

Model.prototype.editAddClick = function (event) {

var row = Event.bindingcontext. $object;

var addressid = row.val ("id");

var parems = {

Id:addressid,

Operator: "Edit"//Set identity to edit or add new address

}

alert (ADDRESSID);

var url = require.tourl ('./ADD_ADDRESS.W ');

Justep. Shell.showpage (URL, parems);

};

Use the ShowPage method to open the new page.

3. Click Set Default Address

Default Address

Model.prototype.col10Click = function (event) {

var row = Event.bindingcontext. $object;

var data = This.comp (' Addressdata ');

var url = require.tourl (url_window+ "/uapp/updefault_placeofreceipt.htm?jsoncallback=?");

var datas = {

Id:row.val ("id")//get current row ID

}

$.ajaxsettings.async = false;

$.getjson (url,datas,function (data) {///interface is saved to the database

});

Data.setvalue ("Address_default", "0", Data.find (["Address_default"],["1"]) [0]);//Set unchecked row status to 0

Data.setvalue ("Address_default", "1", row);//Set the current line status to 1,

};

The default component is radio. 650) this.width=650; "Src=" Http://s2.51cto.com/wyfs02/M02/8B/DD/wKioL1hbbQvgTabEAAAIB-meniI711.png-wh_500x0-wm_3 -wmp_4-s_1983787665.png "title=" 5.png "width=" "height=" "border=" 0 "hspace=" 0 "vspace=" 0 "style=" width:100px; height:41px, "alt=" wkiol1hbbqvgtabeaaaib-menii711.png-wh_50 "/> can also set other components

This article is from the Web front-end Siege guru blog, so be sure to keep this source http://xiaochegnzi.blog.51cto.com/11150997/1885070

WEX5 the management of the actual combat delivery address (i)