AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

【jquery模仿net控件】简单的datalist控件更新，及其简单应用

2017-12-13 780
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
接上次的帖子：http://www.cnblogs.com/yexiaochai/archive/2012/01/22/2328729.html

简单的更新了一下代码，主要针对datalist，这次主要贴出更新后的代码以及演示一下例子：

因为过年的关系，感觉自己很懒，贴出来算是一种自我激励吧，让自己有写下去的动力

功能说明

 就数据缓存一块可能要放在最后优化

① datalist嵌套

② datalist编辑、删除按钮出现（还有问题）

③ datalist根据数据源、样式模板的不同展现方式不同

④ 各个html元素事件绑定

实例

 我现在有一张新闻类型表；一张新闻表。

 第一个datalist将所有类型列表展示出来，

 在datalist里面嵌套一个具体新闻的datalist，现在显示三条，

 然后每个新闻类型上面有个最大化，点击则实例化一个datalist，将对应新闻类型的10条新闻列出来。

具体新闻上有个还原按钮，点击则还原。

 

实例贴图

① datalist嵌套，新闻类型嵌套新闻

 







 



 

 






 ② 点击最大化按钮界面







点击最小化后便还原。

所用到的datalist模板

 



首页外层新闻类型datalist模板
<div>
  <div id="itemId" style="display:none;">{%ItemID%}</div>
  <h1>{%ItemName%}</h1>
  <input  class="maxOrMinSize" type="button" value="最大化" />
</div>
<div  id="itemNews">
</div>
<hr/>
　　

首页内层datalist新闻列表模板
<div>
  {%newsName%}
</div>
　　

最大化后的模板
<div>
  {%newsName%}
  <input  class="newsMore" value="详情" type="button"/>
</div>
<div style=" display:none;" class="newsContent">
  {%newsContent%}
</div>
<hr/>
　　

datalist.js以及itemTemplate.js和Ajax后台处理程序

 

/// <reference path="../scripts/jquery-1.4.1.js" />
 
/*
思考：
1 如何给数据项某个html标签添加事件
因为我们并不知道生成的dom树是什么，所以模板里面的html标签无法绑定事件，暂时只能后期绑定
 
*/
/* 控件生成流程
 
*/
 
var dataList = function (id, templateUrl) {
    this.attribute = {
        id: id,
        name: "",
        title: ""
    };
    this.style = {
        width: "",
        height: ""
    };
    this.itemEvent = {
        onClick: null,
        onDblclick: null,
        onKeydown: null,
        onKeypress: null,
        onKeyup: null,
        onMousedown: null,
        onMousemove: null,
        onMouseout: null,
        onMouseover: null,
        onMouseup: null
    };
    this.deleteButton = {
        html: null,
        visible: false,
        clickEvent: null
    };
    this.editButton = {
        html: null,
        visible: false,
        clickEvent: null
    };
    this.cancelButton = {
        html: null,
        visible: false,
        clickEvent: null
    };
    this.saveButton = {
        html: null,
        visible: false,
        clickEvent: null
    };
 
    this.itemElementEvent = {};
    this.className = "";
    this.itemClassName = "";
    this.htmlElement = null;
    this.templateUrl = templateUrl ? templateUrl : ""; //提供项目模板地址
    this.htmlTemplateText = "";
    this.items = [];
    this.dataSource = {}; //应该支持不同数据源
};
 
 
dataList.prototype.dataBind = function (element) {
    this.init();
    var sender = this;
    sender.buttonLoad();
    sender.attributeLoad();
    var templateText = sender.htmlTemplateText;
    var itemEvent = sender.itemEvent;
    var itemElementEvents = sender.itemElementEvent;
    var itemClassName = sender.itemClassName;
    //需要替换itemTemplate
    var itemIndex = 0;
    $.each(sender.dataSource, function (dataKey, dataValue) {
        var _item = new itemTemplate();
        _item.parentId = sender.attribute.id;
        _item.htmlTemplateText = templateText;
        _item.event = itemEvent;
        _item.elementEvent = itemElementEvents;
        _item.className = itemClassName;
        //传递父ID ,当前模板编号，源模板，当前项数据项源，事件绑定源
        _item.load(itemIndex, dataValue);
        var _itemElement = _item.htmlElement;
        sender.items.push(_item);
        sender.insertDomItem(_itemElement);
        itemIndex++;
    });
    //呈现前，样式加载
    sender.styleLoad();
    element.append(sender.htmlElement);
    //模板中的html标签的事件绑定
    var items = sender.items;
    $.each(items, function (i, item) {
        item.bindAllElementEvent();
    });
};
 
dataList.prototype.buttonLoad = function () {
    var sender = this;
    var htmlElement = sender.htmlElement;
    var element = sender.htmlElement;
    var id = sender.attribute.id;
    var button = sender.deleteButton;
    var buttonText = "删除";
    this.buttonBind(id + "_delete", button, element, buttonText);
    button = sender.editButton;
    buttonText = "编辑";
    this.buttonBind(id + "_edit", button, element, buttonText);
    button = sender.cancelButton;
    buttonText = "取消";
    this.buttonBind(id + "_cancel", button, element, buttonText);
    button = sender.saveButton;
    buttonText = "保存";
    this.buttonBind(id + "_save", button, element, buttonText);
 
};
 
dataList.prototype.buttonBind = function (id, btObj, el, buttonText) {
    var sender = this;
    var html = btObj.html;
    var visible = btObj.visible;
    var clickEvent = btObj.clickEvent;
    if (visible) {
        if (!html) {
            html = $("<div>" + buttonText + "</div>");
        }
        html.attr("id", id);
        el.append(html);
        if (clickEvent && typeof (clickEvent) == "function") {
            html.click(function () {
                clickEvent.call(sender);
            });
        }
    }
};
dataList.prototype.init = function () {
    var sender = this;
    var templateUrl = sender.templateUrl;
    if (!templateUrl || templateUrl.length == 0)
        templateUrl = "itemTemplate/itemTemplate.spt";
    this.htmlTemplateText = getAjaxStr(templateUrl);
    var htmlElement = $("<div id='" + sender.attribute.id + "'></div>");
    if (sender.className && sender.className.length > 0)
        htmlElement.attr("class", sender.className);
    sender.htmlElement = htmlElement;
};
 
 
 
dataList.prototype.attributeLoad = function () {
    var sender = this;
    var element = sender.htmlElement;
    $.each(sender.attribute, function (attributeKey, attributeValue) {
        if (attributeKey != "id")
            if (attributeValue && attributeValue.length > 0) {
                element.attr(attributeKey, attributeValue);
            }
    });
}
 
dataList.prototype.styleLoad = function () {
    var sender = this;
    var element = sender.htmlElement;
    $.each(sender.style, function (styleKey, styleValue) {
        //                alert(styleKey + ":" + styleValue);
        if (styleValue) {
            //            alert(element);
            element.css(styleKey, styleValue);
        }
    });
}
 
dataList.prototype.insertDomItem = function (domItem) {
    var sender = this;
    var element = sender.htmlElement;
    element.append(domItem);
};
 
//异步获取文件
function getAjaxStr(url) {
    var templateStr = "";
    $.ajax({
        url: url,
        async: false,
        dataType: "html",
        success: function (result) {
            templateStr = result;
            if (templateStr)
                return templateStr;
        },
        error: function (e) {
            alert("模板加载错误：" + e.toString());
        }
    });
    return templateStr;
}
　　

/// <reference path="../scripts/jquery-1.4.1.js" />
 
var itemTemplate = function () {
    //源模板文本，现在为itemTemplate.spt
    //可能是文本，可能是js文件，可能是字符串
    //最终形成字符串传给htmlTemplateText
    this.htmlTemplateText = "";
    //最终会形成一独立html字符串，dom结构的标签
    this.htmlElement = null;
    this.idPrefix = "id_"; //id前缀
    this.parentId = "";
    this.id = "";
    this.className = "";
    this.event = {
        onClick: null,
        onDblclick: null,
        onKeydown: null,
        onKeypress: null,
        onKeyup: null,
        onMousedown: null,
        onMousemove: null,
        onMouseout: null,
        onMouseover: null,
        onMouseup: null
    };
    this.elementEvent = null;
};
 
itemTemplate.prototype.load = function (itemIndex, itemDataSource) {
    var sender = this;
    var id = sender.parentId + "_" + sender.idPrefix + itemIndex;
    sender.id = id;
    var element = $("<div id='" + id + "'></div>");
    var html = "";
    var _templateText = sender.htmlTemplateText;
    tempHtm = _templateText;
    $.each(itemDataSource, function (i, item) {
        var id = item;
        var regStr = "/\\{%" + i + "%\\}/g";
        var reg = eval(regStr);
        tempHtm = tempHtm.replace(reg, item);
    });
    html = tempHtm;
    element.append($(html))
    if (sender.className && sender.className.length > 0)
        element.attr("class", sender.className);
    sender.htmlElement = element;
    sender.bindEvent();
};
 
itemTemplate.prototype.bindEvent = function () {
    var sender = this;
    var element = sender.htmlElement;
    var events = sender.event;
    $.each(events, function (eventKey, funcName) {
        //        alert(funcKey + "---" + funcValue);
        if (funcName && typeof (funcName) == "function") {
            var _event = eventKey;
            _event = _event.substring(2, _event.length);
            _event = _event.toLowerCase();
            element.unbind(_event);
            element.bind(_event, function () {
                funcName.call(sender);
            });
        }
    });
};
 
itemTemplate.prototype.getItemElement = function (elementKey) {
    var sender = this;
    var id = "#" + sender.id + " " + elementKey;
    var element = $(id);
    return element;
};
itemTemplate.prototype.bindAllElementEvent = function () {
    var sender = this;
    var itemElementEvents = sender.elementEvent;
    //    alert(element+"=="+id);
    //数据项元素事件绑定
    $.each(itemElementEvents, function (eventObjKey, eventObj) {
        var elementKey = eventObj.elementKey;
        var eventType = eventObj.eventType;
        var funcName = eventObj.funcName;
        sender.bindElementEvent(elementKey, eventType, funcName);
    });
};
itemTemplate.prototype.bindElementEvent = function (elementKey, eventType, funcName) {
    var sender = this;
    var id = "#" + sender.id + " " + elementKey;
    var element = $(id);
    if (funcName && typeof (funcName) == "function") {
        if (eventType == "ready") {
            element.ready(function () {
                funcName.call(sender);
            });
        } else {
            element.unbind(eventType);
            element.bind(eventType, function () {
                funcName.call(sender);
            });
        }
    }
};
　　

//ajax后台处理代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using Newtonsoft.Json;
 
public partial class js仿net控件_02dataList_Ajax : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            DataAccess db = new DataAccess();
            DataTable dt = null;
            string sql = "";
            if (Request["sql"] != null)
            {
                sql = Request.QueryString["sql"].ToString();
                dt = db.GetDataTable(sql);
            }
            string jsonText = getJson(dt);
            Response.Clear();
            Response.ContentType = "application/json";
            Response.Write(jsonText);
            Response.End();
        }
    }
    private string getJson(DataTable dt)
    {
        string jsonText = JsonConvert.SerializeObject(dt);
        return jsonText;
    }
    private string getStr(DataTable dt)
    {
        string json = "{";
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            json = json + "row_"+i.ToString()+":"+"{";
            for (int j = 0; j < dt.Columns.Count; j++)
            {
                string colKey = dt.Columns[j].ColumnName;
                string colValue = dt.Rows[i][j].ToString();
                //colValue = colValue.Replace("\"","\\\"");
                json = json + colKey + ":" + colValue + ",";
            }
            json = json.Substring(0, json.Length - 1);
            json = json + "},";
        }
        json = json.Substring(0, json.Length - 1);
        json = json + "}";
        return json;
    }
}
　　

前台调用，此处详细说明下

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="js/itemTemplate.js" type="text/javascript"></script>
    <script src="js/dataList.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var dataItems = {};
            $.ajax({
                type: "post",
                url: "Ajax.aspx?sql=select top 3 * from Item where ItemKind=1 ",
                type: "json",
                async: false,
                success: function (data) {
                    dataItems = data;
                }
            });
            var $div = $("#wl");
            var listItem = new dataList("newsItem", "itemTemplate/items.spt");
            var itemElementEvents = {
                loadItemNews: {
                    elementKey: "#itemNews",
                    eventType: "ready",
                    funcName: elementDatabind
                },
                newsMaxOrMinSize: {
                    elementKey: ".maxOrMinSize",
                    eventType: "click",
                    funcName: newsMaxOrMinSizeClick
                }
            };
 
            listItem.itemElementEvent = itemElementEvents;
            listItem.dataSource = dataItems;
            listItem.dataBind($div);
 
            function newsMaxOrMinSizeClick() {
                var sender = this;
                var $itemId = sender.getItemElement("#itemId");
                var $maxNews = $("#maxNews");
                var id = $itemId.html();
                var dataNews = {};
                $.ajax({
                    type: "post",
                    url: "Ajax.aspx?sql=select top 10  newsId,newsName, newsContent from news where itemId='" + id + "' ",
                    type: "json",
                    async: false,
                    success: function (data) {
                        dataNews = data;
                    }
                });
                var _itemElementEvents = {
                    contentClick: {
                        elementKey: ".newsMore",
                        eventType: "click",
                        funcName: maxContentMoreClick
                    }
                };
                var newsMaxList = new dataList("newsMax", "itemTemplate/itemMax.spt");
                newsMaxList.deleteButton.visible = true;
                newsMaxList.deleteButton.html = $("<input value='最小化' type='button'  ></a>");
                newsMaxList.deleteButton.clickEvent = newsMin;
 
                newsMaxList.editButton.visible = true;
                newsMaxList.editButton.html = $("<input value='编辑' type='button'  ></a>");
                newsMaxList.editButton.clickEvent = newsMin;
 
                newsMaxList.itemEvent.onMousemove = itemmousemove;
                newsMaxList.itemEvent.onMouseout = itemmouseout;
                newsMaxList.itemElementEvent = _itemElementEvents;
                newsMaxList.dataSource = dataNews;
                newsMaxList.dataBind($maxNews);
                $div.hide(1000);
                $maxNews.show(1000);
            }
 
            function elementDatabind() {
                var sender = this;
                var $itemId = sender.getItemElement("#itemId");
                var $itemNews = sender.getItemElement("#itemNews");
                var id = sender.id;
                var id = $itemId.html();
                var s = $itemNews.html();
                var dataNews = {};
                $.ajax({
                    type: "post",
                    url: "Ajax.aspx?sql=select top 5  newsId,newsName, newsContent from news where itemId='" + id + "' ",
                    type: "json",
                    async: false,
                    success: function (data) {
                        dataNews = data;
                    }
                });
                var listItemNews = new dataList(id + "_news", "itemTemplate/itemTemplate.spt");
                listItemNews.itemEvent.onMousemove = itemmousemove;
                listItemNews.itemEvent.onMouseout = itemmouseout;
                listItemNews.dataSource = dataNews;
                listItemNews.dataBind($itemNews);
            }
            function newsMin() {
                var sender = this;
                var $maxNews = $("#maxNews");
                $maxNews.html("");
                $div.show(1000);
                $maxNews.hide(1000);
            }
            function maxContentMoreClick() {
                var sender = this;
                var newsContent = sender.getItemElement(".newsContent");
                var contentMore = sender.getItemElement(".newsMore");
                if (newsContent.css("display") == "none") {
                    contentMore.attr("value", "隐藏");
                    newsContent.css("display", "");
                } else {
                    contentMore.attr("value", "详情");
                    newsContent.css("display", "none");
                }
            }
 
            function itemmousemove() {
                var sender = this;
                var $ee = sender.htmlElement;
                $ee.css("background", "Gray");
            }
            function itemmouseout() {
                var sender = this;
                var $ee = sender.htmlElement;
                $ee.css("background", "white");
            }
 
        });
    </script>
</head>
<body>
    <div id="wl"   >
    </div>
    <div id="maxNews" style=" display:none;">
     
    </div>
</body>
</html>
　　

前台调用说明

 

① 获得数据源：

 

[{"ItemID":79,"ParentID":0,"ItemName":"学院新闻11","ItemContent":"","ItemSort":7,"ItemKind":1,"ItemUrl":"","IsTop":0,
"IsImportant":null,"IsHome":null,"NewsSort":null},{"ItemID":150,"ParentID":79,"ItemName":"学生工作","ItemContent":"",
"ItemSort":1,"ItemKind":1,"ItemUrl":"","IsTop":1,"IsImportant":null,"IsHome":1,"NewsSort":null},{"ItemID":162,"ParentID":129
,"ItemName":"常规工作","ItemContent":"","ItemSort":4,"ItemKind":1,"ItemUrl":"","IsTop":1,"IsImportant":null,"IsHome":1,"NewsSort":null}]
　　

 第一个datalist的绑定与生成：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var $div = $("#wl");
            var listItem = new dataList("newsItem", "itemTemplate/items.spt");
            var itemElementEvents = {
                loadItemNews: {
                    elementKey: "#itemNews",
                    eventType: "ready",
                    funcName: elementDatabind
                },
                newsMaxOrMinSize: {
                    elementKey: ".maxOrMinSize",
                    eventType: "click",
                    funcName: newsMaxOrMinSizeClick
                }
            };
 
            listItem.itemElementEvent = itemElementEvents;
            listItem.dataSource = dataItems;
            listItem.dataBind($div);
　　

① 准备一个装datalist的容器div

② 初始化datalist为其设置id与对应模板文件地址（其实数据源与模板文件后期必须想法接受多个方案，比如xml或者数组、地址什么的）

③ 因为模板里面的元素我们无法控制，所有使用jquery的选择器进行元素选择（这个必须在该元素生成结束才能事件绑定，这个地方有问题）

    注意第一个事件绑定，在这里html元素生成后，便会执行此函数，但是不知道这样写有没有问题

    第二个事件便是最大化按钮点击事件

④ 然后bind结束第一个datalist生成结束

具体html代码如下：

+ View Code
　　

第二个datalist绑定

function elementDatabind() {
               var sender = this;
               var $itemId = sender.getItemElement("#itemId");
               var $itemNews = sender.getItemElement("#itemNews");
               var id = sender.id;
               var id = $itemId.html();
               var s = $itemNews.html();
               var dataNews = {};
               $.ajax({
                   type: "post",
                   url: "Ajax.aspx?sql=select top 5  newsId,newsName, newsContent from news where itemId='" + id + "' ",
                   type: "json",
                   async: false,
                   success: function (data) {
                       dataNews = data;
                   }
               });
               var listItemNews = new dataList(id + "_news", "itemTemplate/itemTemplate.spt");
               listItemNews.itemEvent.onMousemove = itemmousemove;
               listItemNews.itemEvent.onMouseout = itemmouseout;
               listItemNews.dataSource = dataNews;
               listItemNews.dataBind($itemNews);
           }
　　

此处接着第一个datalist的事件绑定，绑定结束后便又初始化各个datalist，并加入对应容器中。并加上新闻列滑动事件。

注意此处id最好不要重复

点击最大化后，弹出的第三个datalist

function newsMaxOrMinSizeClick() {
               var sender = this;
               var $itemId = sender.getItemElement("#itemId");
               var $maxNews = $("#maxNews");
               var id = $itemId.html();
               var dataNews = {};
               $.ajax({
                   type: "post",
                   url: "Ajax.aspx?sql=select top 10  newsId,newsName, newsContent from news where itemId='" + id + "' ",
                   type: "json",
                   async: false,
                   success: function (data) {
                       dataNews = data;
                   }
               });
               var _itemElementEvents = {
                   contentClick: {
                       elementKey: ".newsMore",
                       eventType: "click",
                       funcName: maxContentMoreClick
                   }
               };
               var newsMaxList = new dataList("newsMax", "itemTemplate/itemMax.spt");
               newsMaxList.deleteButton.visible = true;
               newsMaxList.deleteButton.html = $("<input value='最小化' type='button'  ></a>");
               newsMaxList.deleteButton.clickEvent = newsMin;
 
               newsMaxList.editButton.visible = true;
               newsMaxList.editButton.html = $("<input value='编辑' type='button'  ></a>");
               newsMaxList.editButton.clickEvent = newsMin;
 
               newsMaxList.itemEvent.onMousemove = itemmousemove;
               newsMaxList.itemEvent.onMouseout = itemmouseout;
               newsMaxList.itemElementEvent = _itemElementEvents;
               newsMaxList.dataSource = dataNews;
               newsMaxList.dataBind($maxNews);
               $div.hide(1000);
               $maxNews.show(1000);
           }
　　

那撒，说是详细说明好像也不详细。最后效果是想以此为基础模拟igoogle的效果。可惜我不是美工，我那个悲剧的css水平确实不行。

若是有用，我以后在持续更新吧。

　　

 

 

 

本文转自叶小钗博客园博客，原文链接http://www.cnblogs.com/yexiaochai/archive/2012/01/25/2329489.html，如需转载请自行联系原作者
 



文章标签：
数据格式
JSON
JavaScript
Web App开发
前端开发
关键词：
.NET应用
.NET控件
jQuery控件
jQuery应用
.NET datalist
范大脚脚
目录
相关文章
dotNative
|
存储 Shell Linux
快速上手基于 BaGet 的脚本自动化构建 .net 应用打包
本文介绍了如何使用脚本自动化构建 `.net` 应用的 `nuget` 包并推送到指定服务仓库。首先概述了 `BaGet`——一个开源、轻量级且高性能的 `NuGet` 服务器，支持多种存储后端及配置选项。接着详细描述了 `BaGet` 的安装、配置及使用方法，并提供了 `PowerShell` 和 `Bash` 脚本实例，用于自动化推送 `.nupkg` 文件。最后总结了 `BaGet` 的优势及其在实际部署中的便捷性。
dotNative
548 10
追逐时光者
|
9月前
|
C# Android开发 iOS开发
2025年全面的.NET跨平台应用框架推荐
2025年全面的.NET跨平台应用框架推荐
追逐时光者
346 23
路边两盏灯
|
11月前
|
开发框架 监控 .NET
【Azure App Service】部署在App Service上的.NET应用内存消耗不能超过2GB的情况分析
x64 dotnet runtime is not installed on the app service by default. Since we had the app service running in x64, it was proxying the request to a 32 bit dotnet process which was throwing an OutOfMemoryException with requests >100MB. It worked on the IaaS servers because we had the x64 runtime install
路边两盏灯
172 5
小王老师呀
|
11月前
|
JSON 算法 安全
JWT Bearer 认证在 .NET Core 中的应用
【10月更文挑战第30天】JWT（JSON Web Token）是一种开放标准，用于在各方之间安全传输信息。它由头部、载荷和签名三部分组成，用于在用户和服务器之间传递声明。JWT Bearer 认证是一种基于令牌的认证方式，客户端在请求头中包含 JWT 令牌，服务器验证令牌的有效性后授权用户访问资源。在 .NET Core 中，通过安装 `Microsoft.AspNetCore.Authentication.JwtBearer` 包并配置认证服务，可以实现 JWT Bearer 认证。具体步骤包括安装 NuGet 包、配置认证服务、启用认证中间件、生成 JWT 令牌以及在控制器中使用认证信息
小王老师呀
390 2
喜欢猪猪
|
数据采集 JSON API
.NET 3.5 中 HttpWebRequest 的核心用法及应用
【9月更文挑战第7天】在.NET 3.5环境下，HttpWebRequest 类是处理HTTP请求的一个核心组件，它封装了HTTP协议的细节，使得开发者可以方便地发送HTTP请求并接收响应。本文将详细介绍HttpWebRequest的核心用法及其实战应用。
喜欢猪猪
473 6
杀死一只知更鸟debug
|
C#
winform .net6 和 framework 的图表控件，为啥项目中不存在chart控件，该如何解决？
本文讨论了在基于.NET 6和.NET Framework的WinForms项目中添加图表控件的不同方法。由于.NET 6的WinForms项目默认不包含Chart控件，可以通过NuGet包管理器安装如ScottPlot等图表插件。而对于基于.NET Framework的WinForms项目，Chart控件是默认存在的，也可以通过NuGet安装额外的图表插件，例如LiveCharts。文中提供了通过NuGet添加图表控件的步骤和截图说明。
杀死一只知更鸟debug
884 0
winform .net6 和 framework 的图表控件，为啥项目中不存在chart控件，该如何解决？
小王老师呀
|
12月前
|
开发者 Windows
.NET 开源扁平化、美观的 C/S 控件库
【10月更文挑战第23天】介绍了三款适用于 .NET 平台的开源扁平化、美观的 C/S 控件库：MaterialSkin 采用 Google Material Design 风格，适合现代感界面；Krypton Toolkit 提供丰富控件，界面易于定制；Fluent Ribbon Control Suite 模仿 Office 界面，适合复杂功能应用。每款控件库均附有示例代码及 GitHub 链接。
小王老师呀
462 0
东方睿赢
|
开发框架 JavaScript 前端开发
震撼！破解 ASP.NET 服务器控件 Button 执行顺序之谜，颠覆你的开发认知！
【9月更文挑战第2天】
东方睿赢
291 5
皮牙子抓饭
|
JavaScript 前端开发 UED
jQuery日历控件与假日显示
【9月更文挑战第1天】
皮牙子抓饭
126 3
追逐时光者
|
12月前
|
C# Android开发 iOS开发
一组.NET MAUI绘制的开源控件 - AlohaKit
一组.NET MAUI绘制的开源控件 - AlohaKit
追逐时光者
213 0