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)