wex5 实战 省市县三级联动与地址薄同步
无论是商城,还是快递,都要用到省市县三级联动,和地址薄,今天就以实战来制作,难点有3个:
1:三级联动,有wex5组件实现,相对简单,实战里对行数据进行了拼接
2: 地址薄选项,利用inputSelect的下接属性,装载地址列表。
3:地址薄页面与信息页面的下拉数据同步
一 效果演示:
二 设计思路:
三级联动用组件,把地址信息重新拼接,用下垃组件显示详细地址,用modelParamsReceive的实时性保证不同页面跳转后的数据同步
三 数据库设计:
(注)三级联动,省,市,县,供组件绑定。街,地址,详细地址,由前端写入。
四 三级联动
1 组件选用
provinceSelect 省
citySelect 市
districtSelect 县
2 字段绑定
3 联动方法(分级过滤)
省过滤市
市过滤县
4 地址详情拼接
这里拼接,是为了在地址选项里完整的显示地址全部信息。否则只能先择单一省,或市字段。如果再用json拼接或data装载,代码量增加,不利于写入到快递单地址字段中。这里的冗余字段,优化代码写作。
五 多页面数据同步
地址增删改查完成后,回到信息页,问题来了,地址没有刷新。
除非重新装载web,这时的多页面数据同步非常重要。
这里用modelParasRecive的实时来触发data刷新实现。
1 信息页传参
打开地址页之前,把父页传过去。在不同的页面打开地址页,让地址页返回到当前页。
2 地址页接参
接收父页面信息
3 地址页关闭
传到父页面一个uuid
4 信息页接参并触发data刷新
uuid是不会重复的,只要接参不一致,触发地址data刷新,两个页面时的地址信息进行了刷新。
六 总结
1 三级联动不难,关键是行处理
2 多页面同步,用madelParamsRecive触发实现
wex5 实战 省市县三级联动与地址薄同步的更多相关文章
- 省市县三级联动 sql语句
发现在网上的省市县三级联动大部分是mysql的.就算是sqlserver的,也不准确.于是就把mysql的给改了下,适用sqlserver.sql语句如下: CREATE TABLE Dic_Area ...
- Android 省市县 三级联动(android-wheel的使用)[转]
转载:http://blog.csdn.net/lmj623565791/article/details/23382805 今天没事跟群里面侃大山,有个哥们说道Android Wheel这个控件,以为 ...
- Android 省市县 三级联动(android-wheel的使用)
转载请注明出处:http://blog.csdn.net/lmj623565791/article/details/23382805 今天没事跟群里面侃大山,有个哥们说道Android Wheel这个 ...
- 项目总结01:JSP mysql SpringMvc下中国省市县三级联动下拉框
JSP mysql SpringMvc下中国省市县三级联动下拉框 关键词 JSP mysql数据库 SpringMvc ajax Controller层 Service层 中国地区 省 ...
- android:省市县三级联动(基于json和spring)
一.请看效果图": 二.程序的代码: 1.MainActivity.java package com.loveplusplus.loader.demo.ui; import org.json ...
- 记一次 PHP 省市县三级联动 数据库取值
/** * Notes:省市县三级联动 * Created by depressiom * Date: 2022年4月14日 */ public function getCityData(){ //获 ...
- jQuery - 全国省市县三级联动
最近有空用jquery做了一个全国省市县的三级联动,在以后或许可以用的到 ,遗憾的是我还没用封装,等有空看能不能封装成一个插件 废话不多说,贴上代码: <!doctype html> &l ...
- php仿经典省市县三级联动
之前有个需求要写个类似省市县三级联动的页面,于是,网上找了点资料看了下,其实原理很简单: 当我们选择一级栏目中某条记录的时候,会获取该栏目的vaule值,并发起ajax请求,后台根据这个vaule值, ...
- Day 16 之二 省市县三级联动
摘录自:雨神,供参考! province_dic = { "河北": { "石家庄": ["鹿泉", "藁城", &qu ...
随机推荐
- Android课程---关于GridView网格视图的学习
activity_ui6.xml <?xml version="1.0" encoding="utf-8"?> <GridView xmlns ...
- win7下wndows virtual pc 2007 装xp比新版本的 Windows virtual pc 好用
2007下装xp虚拟机启动快,支持拖放.
- C#.NET中数组、ArrayList和List三者的区别
数组在C#.NET中是最早出现的,在内存中是顺序连续存储的,所以它的索引速度非常快,赋值与修改元素也很简单:但是,也正因为数组是顺序连续存储的,在两个数据间插入数据是很不方便的,而且在声明数组的时候必 ...
- 阿里云服务器Linux CentOS安装配置(二)yum安装svn
阿里云服务器Linux CentOS安装配置(二)yum安装svn 1.secureCRT连接服务器 2.先创建一个文件夹,用来按自己的习惯来,用来存放数据 mkdir /data 3.yum安装sv ...
- mock the facade
mock the facade: Auth::shouldReceive('user')->andReturn($user = m::mock('StdClass')); $user->s ...
- dragdrop 修改版
<!DOCTYPE html> <html lang="en"> <head> <meta name="keywords&quo ...
- c#实现万年历示例分享 万年历农历查询
cs.cs(类页面) using System;using System.Collections.Generic;using System.Linq;using System.Web; namespa ...
- (java oracle)以bean和array为参数的存储过程及dao部分代码
一.数据库部分 1.创建bean对象 CREATE OR REPLACE TYPE "QUARTZJOBBEAN" as object ( -- Author : Duwc -- ...
- jvm性能参数与调优
本文中的参数并齐全,看了http://www.cnblogs.com/redcreen/archive/2011/05/04/2037057.html的相关文章写得很好,可以看一看 1.jvm堆内存简 ...
- http://www.cnblogs.com/holly8/p/6178828.html
http://www.cnblogs.com/holly8/p/6178828.html