HTML Select Drop Down List Data Source From Web API

前端,html还是mvc页面,我们想实现一个下拉选单,写<select>指定id或者name,稍后在js代码能获取到它。

 

#7~#9行,没有参数条件可传,保留为空。#19 Web API地址。#21为异步方法,看下,

#37,是为了不让代码写在一块,Insus.NET已经重构成另一个function,也是本示例中重点核心代码,


下面继续看看,下拉选单,在编辑时,需要给下拉选单一个前期已经选择好的值,并在下拉选单呈现时,它是选中状态,
编辑或是详细页面,js加载数据,并把各自绑定给页面tag,

#6行,下拉选单数据绑定,

#25行,Web API地址,具体API如何写,可以参本博客前此时间的随笔。
#27行,已经被重构成另外单独function,仔细看来,

 

#41行,看到否, selectedValue参数,它是默认的下拉选单选中的值。

 

#59行,从下拉选单的数据源中,判断键值与selectedValue相同,即在生成option时,添加selected。

基本上完成了,非编辑与编辑,Insus.NET使用不同语法动态生成下拉选单的option。

最后来个动态演示,

 

posted @   Insus.NET  阅读(18)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 清华大学推出第四讲使用 DeepSeek + DeepResearch 让科研像聊天一样简单!
· 推荐几款开源且免费的 .NET MAUI 组件库
· 实操Deepseek接入个人知识库
· 易语言 —— 开山篇
· 【全网最全教程】使用最强DeepSeekR1+联网的火山引擎,没有生成长度限制,DeepSeek本体
历史上的今天:
2020-01-04 获取数据表中列的描述值
2011-01-04 SQL Server EXCEPT
2011-01-04 表表达式
点击右上角即可分享
微信分享提示