• C# 下拉列表 多级联动 MVC API


    create table City
    (
     Id int identity, 
     Name varchar(30),
     Pid int ,
     )
    

     MVC显示页面

    @{
        ViewBag.Title = "Index";
    }
    @using MVC.Models;
    <h2>Index</h2>
    <div id="sel">
        <select onchange="BandNext(this)">
            <option value="-1">--请选择--</option>
            @foreach (City item in ViewBag.Xiala as List<City>)
            {
                <option value="@item.Id">@item.Name</option>
            }
        </select>
    
    </div>
    
    <script>
        function BandNext(obj) {
            var Pid = $(obj).val();
            $(obj).nextAll().remove();
            if (Pid ==-1) {
                return;
            }
            $.ajax({
                url: "https://localhost:44372/API/API?Pid=" + Pid,
                //dataType: "json",
                type: "get",
                success: function (d) {
                    var sel = '<select onchange="BandNext(this)"> '
                    sel += '<option value="-1">--请选择--</option> '
                    $(d).each(function () {
                        sel += ' <option value="' + this.Id + '">'+this.Name+'</option>'
                    })
                    sel += '</select>';
                    $("#sel").append(sel);
                }
            })
        }
    </script>
    

     MVC 后台

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using MVC.Models;
    using Newtonsoft.Json;
    namespace MVC.Controllers
    {
        public class MVCController : Controller
        {
            HttpClientHelper helper = new HttpClientHelper("https://localhost:44372/API/API/");
            // GET: MVC
            public ActionResult Index()
            {
                string json = helper.Get("GetShow?Pid=0");
                ViewBag.Xiala = JsonConvert.DeserializeObject<List<City>>(json);
               
                return View();
            }
        }
    }
    

     API 代码

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Net.Http;
    using System.Web.Http;
    using System.Data.SqlClient;
    using Dapper;
    using System.Data;
    using API.Models;
    
    namespace API.Controllers
    {
        public class APIController : ApiController
        {
            public List<City> GetShow(int Pid = 0)
            {
                using (IDbConnection conn = new SqlConnection("Data Source=.;Initial Catalog=x1rk16;Integrated Security=True"))
                {
                    string sql = $"select * from City where 1=1 and Pid={Pid}";
                    List<City> model = conn.Query<City>(sql).ToList();
                    return model;
                }
    
            }
        }
    }
  • 相关阅读:
    DataTable中的增删改查
    如何修改SQLServer的登录验证模式为混合验证模式(转载)
    asp.net C# 技术小点
    利用JQuery动态删除Table表格的行和列
    ASP.NET利用JQuery中的Aajax实现JSON数据后台交互
    MySQL Explain 详解
    Python字符串操作
    Linux中last的用法及参数,查看登陆系统用户的信息
    fedora 16 mysql远程连接
    Linux下MySQL 5.5.21 服务器日志配置
  • 原文地址:https://www.cnblogs.com/2018cjx/p/12159716.html
Copyright © 2020-2023  润新知