zz黑炭 2018-07-09 12:11 采纳率: 53.8%
浏览 1571
已采纳

C# ajax读取后台接口,填充给select下拉框

C#,后台接口(post方式)来获取所有板块的名字,路由如下所示:
[HttpPost]
[Route("shuliang/getallName")]

接口返回如下json:
{
“BankuaiNames”:
[
"板块1"
"板块2"
"板块3"
"板块4"
]
}

现在想要在前台通过ajax,读取后台接口返回的json,并且用js绑定到select下拉框,
进行显示
如下图所示

图片说明

求指点

  • 写回答

3条回答 默认 最新

  • threenewbee 2018-07-09 12:51
    关注
     using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    
    namespace Q694264.Controllers
    {
        [HandleError]
        public class HomeController : Controller
        {
            public ActionResult Index()
            {
                ViewData["Message"] = "Welcome to ASP.NET MVC!";
    
                return View();
            }
    
            public ActionResult About()
            {
                return View();
            }
    
            [HttpPost]
            public string getallName()
            { 
                return @"{
        ""BankuaiNames"":
        [
            ""板块1"",
            ""板块2"",
            ""板块3"",
            ""板块4"",
            ""asdf""
        ]
    }";
            }
        }
    }
    
    
     <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
    
    <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
        Home Page
    </asp:Content>
    
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        <h2><%: ViewData["Message"] %></h2>
    <%--    <p>
            To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
        </p>--%>
        <script type="text/javascript">
            window.onload = function () {
                $.ajax({
                    url: "/home/getallName",
                    type: "POST",
                    data: "",
                    dataType: "json",
                    success: function (data) {
                        for (var i = 0; i < data.BankuaiNames.length; i++) {
                            $("#yys").append("<option>" + data.BankuaiNames[i] + "</option>");
                        }
                    },
                    error: function (data) {
                        alert("err");
                    }
                });
            };
        </script>
        运营商:<select id="yys" name="yys">
            <option>--请选择运营商---</option>
        </select>
    </asp:Content>
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥30 关于#opencv#的问题:使用大疆无人机拍摄水稻田间图像,拼接成tif图片,用什么方法可以识别并框选出水稻作物行
  • ¥15 Python卡尔曼滤波融合
  • ¥20 iOS绕地区网络检测
  • ¥15 python验证码滑块图像识别
  • ¥15 根据背景及设计要求撰写设计报告
  • ¥20 能提供一下思路或者代码吗
  • ¥15 用twincat控制!
  • ¥15 请问一下这个运行结果是怎么来的
  • ¥15 单通道放大电路的工作原理
  • ¥30 YOLO检测微调结果p为1