1.引用easyui样式及脚本文件

2.数据库创建表(自联表)及数据建模(Code First)

use DataBase
go
CREATE TABLE OP_SJ
(
CID UNIQUEIDENTIFIER PRIMARY KEY DEFAULT(NEWID()),
PCID UNIQUEIDENTIFIER,
CNO VARCHAR(50),
CTEXT VARCHAR(50)
)

数据建模:Models =》添加=》新建项=》左侧选择Date=》ADO.NET 实体数据模型=》添加=》来自数据库的Code First=》选择对应数据库及要建模的表

3.前端js和h5代码

<script type="text/javascript">
window.onload = function () {
$.ajax({
model: "raw",
async: true,
type: "get",
url: "/SJLD/GETALL",
success: function (data) {
if (data != null && data.length > 0) {
$("#sheng").combobox({
editable: false,
data: data,
valueField: 'CID',
textField: 'CTEXT',
onLoadSuccess: function (data) {
$(this).combobox("setValue", data[0].CID);
shi(data[0].CID);
},
onSelect: function (record) {
shi(record.CID);
}
})
}
}
})
}
function shi(id) {
$.ajax({
type: "get",
url: "/SJLD/shi",
data: 'id=' + id,
success: function (data) {
if (data != null && data.length > 0) {
$("#shi").combobox({
editable: false,
data: data,
valueField: 'CID',
textField: 'CTEXT',
onLoadSuccess: function (data) {
$(this).combobox("setValue", data[0].CID);
qu(data[0].CID);
},
onSelect: function (record) {
qu(record.CID);
}
})
}
}
})
}
function qu(id) {
$.ajax({
type: "get",
url: "/SJLD/qu",
data: 'id=' + id,
success: function (data) {
if (data != null && data.length > 0) {
$("#qu").combobox({
editable: false,
data: data,
valueField: 'CID',
textField: 'CTEXT',
onLoadSuccess: function (data) {
$(this).combobox("setValue", data[0].CID);
}
})
}
}
})
}
</script> <div> 省:<input id="sheng" class="easyui-combobox" name="sheng" /> 市:<input id="shi" class="easyui-combobox" name="shi" /> 区:<input id="qu" class="easyui-combobox" name="qu" /> </div>

4.新建控制器及后台代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization.Json;
using System.Web;
using System.Web.Helpers;
using System.Web.Mvc;
using LD.Models;
using Newtonsoft.Json; namespace LD.Controllers
{
public class SJLDController : Controller
{
Model1 db = new Model1();
// GET: SJLD
public ActionResult Index()
{
return View();
}
public ActionResult GETALL()
{
var all = db.OP_SJ.Where(m => m.PCID == null).ToList();
return Json(all, JsonRequestBehavior.AllowGet);
}
public ActionResult shi(Guid id)
{
var linq = db.OP_SJ.Where(m => m.PCID == id).ToList();
return Json(linq, JsonRequestBehavior.AllowGet);
}
public object qu(Guid id)
{
var linq = db.OP_SJ.Where(m => m.PCID == id).ToList();
return Json(linq, JsonRequestBehavior.AllowGet);
}
}
}

5.效果

easyui+ef实现省市区三级联动的更多相关文章

  1. jQuery省市区三级联动插件

    体验效果:http://hovertree.com/texiao/bootstrap/4/支持PC和手机移动端. 手机扫描二维码体验效果: 代码如下: <!DOCTYPE html> &l ...

  2. 省市区三级联动 pickerView

    效果图 概述 关于 省市区 三级联动的 pickerView,我想大多数的 iOS 开发者应该都遇到过这样的需求.在遇到这样的需求的时候,大多数人都会觉的这个很复杂,一时无从下手.其实真的没那么复杂. ...

  3. JS省市区三级联动

    不需要访问后台服务器端,不使用Ajax,无刷新,纯JS实现的省市区三级联动. 当省市区数据变动是只需调正js即可. 使用方法: <!DOCTYPE html><html>< ...

  4. ajax省市区三级联动

    jdbc+servlet+ajax开发省市区三级联动 技术点:jdbc操作数据库,ajax提交,字符拦截器,三级联动 特点:局部刷新达到省市区三级联动,举一反三可以做商品分类等 宗旨:从实战中学习 博 ...

  5. QQ JS省市区三级联动

    如下图: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title ...

  6. 省市区三级联动(二)JS部分简单版

    通过对上一篇<省市区三级联动>的学习发现JScript部分省市区的填充代码几乎相同,所以可以写成一个函数. 注意:html部分和chuli.php部分不变 1.下拉列表填充可以写成带参数的 ...

  7. 从QQ网站中提取的纯JS省市区三级联动

    在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动 QQ是使用引用外部JS来实现三级联动的.JS如下:http://ip.qq.com/js/geo.js <!DOC ...

  8. 基于ThinkPHP+AJAX的省市区三级联动

    练习,就当练习. 省市区三级联动,样式如下图所示: 1,导入两个js文件并且导入数据库文件. 两个js文件分别是jquery-2.1.4.min.js和jquery-1.js,数据库文件,见附件. 2 ...

  9. java的JCombobox实现中国省市区三级联动

    源代码下载:点击下载源代码 用xml存储中国各大城市的数据. xml数据太多了就不贴上了,贴个图片: 要解释xml,添加了一个jdom.jar,上面的源代码下载里面有. 解释xml的类: packag ...

随机推荐

  1. Python编程系列---装饰器执行的底层原理及流程

    代码中No.1  No.2 ...表示执行流程 """No.1 No.2 ...表示执行流程""" def set_func(func): ...

  2. linux-查看服务器内存使用情况(free top)

    free命令:显示系统使用和空闲的内存情况,包括物理内存.交互区内存(swap)和内核缓冲区内存. [root@ipha-dev71- workspace]# free # kb total used ...

  3. org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerMapping

    配置spring+shiro时,启动tomcat报错异常 严重: Context initialization failedorg.springframework.beans.factory.Bean ...

  4. 百万年薪python之路 -- 软件的开发规范

    一. 软件的开发规范 什么是开发规范?为什么要有开发规范呢? 你现在包括之前写的一些程序,所谓的'项目',都是在一个py文件下完成的,代码量撑死也就几百行,你认为没问题,挺好.但是真正的后端开发的项目 ...

  5. Java IO编程——File文件操作类

    在Java语言里面提供有对于文件操作系统操作的支持,而这个支持就在java.io.File类中进行了定义,也就是说在整个java.io包里面,File类是唯一 一个与文件本身操作(创建.删除.重命名等 ...

  6. 设计模式(十二)Decorator模式

    Decorator模式就是不断地为对象添加装饰的设计模式.以蛋糕为例,程序中的对象就相当于蛋糕,然后像不断地装饰蛋糕一样地不断地对其增加功能,它就变成了使用目的更加明确的对象. 首先看示例程序的类图. ...

  7. datatable dataset

    简单讲解一下dataset和datatable,以excel对比,dataset相当于一个excel文件,datatable相当于excel的一张表格.datatable可以单独应用,dataset里 ...

  8. 持久层框架JPA与Mybatis该如何选型

    一.现状描述 目前java 持久层ORM框架应用最广泛的就是JPA和Mybatis.JPA只是一个ORM框架的规范, 对该规范的实现比较完整就是Spring Data JPA(底层基于Hibernat ...

  9. ulua、tolua原理解析

    在聊ulua.tolua之前,我们先来看看Unity热更新相关知识. 什么是热更新 举例来说: 游戏上线后,玩家下载第一个版本(70M左右或者更大),在运营的过程中,如果需要更换UI显示,或者修改游戏 ...

  10. Window 同时安装Python2和Python3 终极版

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/vitaminc4/article/det ...