easyui+ef实现省市区三级联动

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.效果

 

作者:江北

出处:https://www.cnblogs.com/zhangnever/p/10803717.html

版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

微信:CodeDoraemon

posted @   江北、  阅读(1002)  评论(0编辑  收藏  举报
编辑推荐:
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 使用C#创建一个MCP客户端
· ollama系列1:轻松3步本地部署deepseek,普通电脑可用
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示
more_horiz
keyboard_arrow_up dark_mode palette
选择主题
晓看天色暮看云