C#如何用ajax把本地数据库的数据显示在前端页面(view里面)?例如一个span一个div

我请说下,C#如何用ajax把本地数据库的数据显示在前端页面(view里面)?例如一个span一个div?

语言为C#,用的是MVC,框架.net core2.0 ,数据库名:AbpProjectNameDb,表名:T_PROBLEM,字段名:F_ID,F_DESCRIPTION,F_CREATETIME。
前端部分代码:
<div id="Q1" class="panel-collapse collapse">
<div class="panel-body">
<h3>如何找回密码?</h3>
<p class="QuestionSubtitle">
<span>提问人:</span><span>李强</span><span>提问时间:</span><span>2017-12-18 10:23</span><span>回答人:</span><span>王建</span><span>2017-12-12 10:30</span>
</p>
<p class="QuestionText">
<span>
如果您还记得账号的话,可以通过以下方法找回密码:
1、首页登录界面中找到“找回密码”链接,进入后可以通过邮箱找回,输入注册时填写的邮箱号,并验证后修改密码即可找回;
</span>
</p>
</div>
</div>
割------------------------------------------------------------------------------------------就是要把方法写在cs里面还是用JS写ajax的我现在很懵逼,需要写个for循环把数据丢到里面,麻烦各位大佬写的详细点,最好贴源码谢谢
最新回答
南风草木香

2024-04-24 00:06:46

首先写一个一般处理程序来获取到你要加载到前台的数据,并序列化成json格式。

//代码实例
public class AjaxUserList : IHttpHandler {

        public void ProcessRequest(HttpContext context) {
            context.Response.ContentType = "text/plain";
            BLL.UserInfoBll userInfoBll = new BLL.UserInfoBll();
            int pageIndex;
            if (!int.TryParse(context.Request["pageIndex"],out pageIndex)) {
                pageIndex = 1;
            }
            int pageSize = 5;
            int pageCount = userInfoBll.GetPageCount(pageSize);
            //判断当前页码的取值范围
            pageIndex = pageIndex < 1 ? 1 : pageIndex;
            pageIndex = pageIndex > pageCount ? pageCount : pageIndex;
            //获取分页数据
            List<Model.UserInfo> userList = userInfoBll.GetPageList(pageIndex, pageSize);
            //获取页码条
            string pageBar = Util.PageBar.GetPageBar(pageIndex, pageCount);

            //***********************************************************
            //使用匿名类将多组数据序列化成Json格式
            //***********************************************************
            JavaScriptSerializer js = new JavaScriptSerializer();
            string json = js.Serialize(new { resultUserList = userList, resultPageBar = pageBar });//此处使用了匿名类将userList集合和pageBar进行封装后,再序列化
            //***********************************************************
            context.Response.Write(json);
        }

        public bool IsReusable {
            get {
                return false;
            }
        }
    }

然后,前台ajax请求这个一般处理处理程序获取到json数据,再通过js将数据添加到html。

//加载用户列表示例
        function LoadUserInfo(pageIndex) {
            $.post("AjaxUserList.ashx", { "pageIndex": pageIndex }, function (data) {
                var serverData = $.parseJSON(data);
                for (var i = 0; i < serverData.resultUserList.length; i++) {
                    $("<tr><td>" + serverData.resultUserList[i].ID + "</td><td>" + serverData.resultUserList[i].UName + "</td><td>" + serverData.resultUserList[i].UPwd + "</td><td>" + ChangeDateFormat(serverData.resultUserList[i].SubTime) + "</td><td>" + serverData.resultUserList[i].Remark + "</td><td><a href='javascript:void(0)' class='details' Uid='" + serverData.resultUserList[i].ID + "'>详细</a></td><td><a href='javascript:void(0)' class='edits' Uid='" + serverData.resultUserList[i].ID + "'>编辑</a>  <a href='javascript:void(0)' class='deletes' Uid='" + serverData.resultUserList[i].ID + "' UName='" + serverData.resultUserList[i].UName + "'>删除</a></td></tr>").appendTo("#tabUserList");
                }
            });
        }
追问
老哥我想问一下,如果用的是entity,然后新写个model把两张表写在里面,那么在页面上用@Viewbag这种方式的,在controller里面的action的return view();里面还要不要写东西的