当前位置: 首页 > article >正文

重写radioselect类自定义个性化单选框

        网页中常常会有单选项的表单,使用django原生的radioselect控件实现前端渲染和后端处理还是很方便的,但是原生 radioselect控制的样式有时不能完全满足需求。比如,图1所示的数据表中有一个颜色的单选项,用户在创建项目需要用这个选项标示项目显示的色彩。

图1

        用原生的 radioselect控件可以这样,在数据表样式设置的modelform类的widgets下直接调用radioselect模块,如图2中红线所示的那样。

图2

        使用原生 radioselect显示的单选项的结果如图3所示:

图3

如果单项的值是文字,这个效果勉强还能用,但本例单选项的数值是色彩的值,用文字显示就不直观了,把字符换成色彩不仅直观,而且界面也美观一些,于是决定定制一个直接显示选项中色彩的个性化radioselect控件来取代原生的。

具体的思路循着原生radioselect控件实现路线,再加一些自定义组件最终实现色彩直选的目的。那么先看看原生的radioselect的路线,图4就是原生模块的代码。

图4

从图4中可以看出,这个模块引用了两个html文件,这两个文件引用了什么也是需要搞清楚的,于是在项目的虚拟环境下找到widgets文件夹,如图5。

图5


http://www.kler.cn/a/409598.html

相关文章:

  • 详细探索xinput1_3.dll:功能、问题与xinput1_3.dll丢失的解决方案
  • 曲谱转换成音频
  • C语言蓝桥杯组题目
  • 【Excel】拆分多个sheet,为单一表格
  • (超级详细!!!)解决“com.mysql.jdbc.Driver is deprecated”警告:详解与优化
  • 基于STM32的火灾报警装置的Proteus仿真
  • Flink四大基石之Window
  • 黄仁勋:人形机器人在内,仅有三种机器人有望实现大规模生产
  • Web 学习笔记 - 网络安全
  • 简单快速区分Shell, sh, bash:
  • C/C++中的回调用法
  • 【测试工具JMeter篇】JMeter性能测试入门级教程(二)出炉,测试君请各位收藏了!!!
  • 《用 Python 和 Tkinter 打造惊喜弹窗小应用教程》
  • 【MySQL】数据库 Navicat 可视化工具与 MySQL 命令行基本操作
  • 【青牛科技】D3308 一块带有 ALC 的双通道前置放大器。它适用于立体声收录机和盒式录音机。
  • 小米C++ 面试题及参考答案下(120道面试题覆盖各种类型八股文)
  • 对象的大小
  • Paddle Inference部署推理(十二)
  • Flink Standalone 集群模式安装部署教程
  • 「Mac玩转仓颉内测版32」基础篇12 - Cangjie中的变量操作与类型管理
  • FileLink内外网文件共享系统与FTP对比:高效、安全的文件传输新选择
  • Js-对象-04-String
  • Leetcode 3366. Minimum Array Sum
  • 基于Vue+SpringBoot的考研学习分享平台设计与实现
  • 在Elasticsearch中,是怎么根据一个词找到对应的倒排索引的?
  • 使用JavaScript操作页面元素