接口拿到的数据通过select下拉框如何回显

最新推荐文章于 2024-08-22 10:05:57 发布

麦兜仪

最新推荐文章于 2024-08-22 10:05:57 发布

阅读量1.4k

点赞数

分类专栏： JavaScript 文章标签： layui

本文链接：https://blog.csdn.net/m0_54914826/article/details/116665056

版权

本文介绍了在前端开发中，如何利用layui框架，将从后端接口获取的数据正确地填充到select下拉框中，并实现选中项与接口返回数据的对应，确保页面展示的正确性。

摘要由CSDN通过智能技术生成

之前做项目的时候遇到一个问题
	就是从ajax后台拿到的data数据里每一条数据的id都是一样的 可是后来不知道怎么解决的  就没管了....

但是今天在做项目的时候遇到了bug
	通过接口动态添加select下拉框选项的时候 通过父页面拿到相应id了但是试过好多方法回显不成功 
    并且不管我选择哪一个选项 提交表单的时候总是拿到某一个id而不是我选的那个
    
	更神奇的是在控制台看 发现我拿到的下拉框接口的数据页数每一条id都是一样的 额....似曾相识..

在这里插入图片描述

但是好在最后找到原因了 :后台给我的id是字符串类型的 但是select下拉框的value值是number类型的 
	所以需要转换一下 只需把回显的 值用   parseInt(id)

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

麦兜仪

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
2
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

select下拉框之数据回显

飞火龙在天的博客

03-15

2万+

估计这是最简单的一种方法了 setTimeout("$('select#menuLevel').val('${menuLevel}')", 100);

html面中select下拉框回显,Layui：select下拉框回显(示例代码)

weixin_34637138的博客

06-03

1040

一.、需求场景分析基于Thymeleaf模板下的layui下选框回显。二、获得一个Layui标配的下拉框，我们需要在html中填写的内容如下* 发送对象：请选择华南理工大学大学城华南理工大学五山校区中山大学珠海校区中山大学大学城校区layui对以上html的渲染结果如何？此处select可供选择的元素是通过jquery从后台数据获得的，需要根据动态结果决定选择哪一个。分析一下渲染结果的结构，得到d...

2 条评论您还未登录，请先登录后发表或查看评论

关于根据后端传给的数据进行回显中下拉框的操作

weixin_48722827的博客

07-24

434

完事我发现后端给我反的字段是字符串而我定义的是数字所以导致了赋值之后没有将name的内容赋上去。后端反我的数据中的method=“1”完事吧这个value改成字符串就好了。再第一次赋值之后发现回显的就是1。

如何解决select下拉框回显是id的问题

最新发布

m0_71207979的博客

08-22

243

思考：在回显的时候在carlist中找到对应的数据，把manageForm.carEmissionType回显的值变为carList中的value值，再通过a-select-option中对应的label显示不就行了！但是回显的是一个value（是一个id）试过给接口中的value手动改为label 但是这样的话在不点击时保存给后端穿的就是改变后的label而不是想要的id。这里后端接口只给了个id 点击操作中的编辑在下面的弹出框中回显。

select的ajax显示下拉框 , 回显

weixin_43891086的博客

08-16

3023

=====常用的select使用 KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲select_id").cha…("#select_id").find(“option:selected”).text(); //获取Select选择的Text var checkValue=KaTeX parse error: Expe...

如何把后台返回的初始值显示在Select的选择框上

weixin_38694789的博客

03-09

1108

oldtableData是后台返回的数组，然后我在过程中遇到最大的问题就是类型不一致；因为我数据库定义的type是int，然后在value那里把1和0都加了引号，变成String型，所以死活也对应不上；还有最后别把option的数据写死，在百度时看到的https://ask.csdn.net/questions/687190 效果: ...

select 下拉列表数据回显

fanghanxing的博客

12-27

8244

今天写代码的时候出现了一个问题。当我按课程进度不到100%进行查询的时候，出现的是上图的结果。这没问题。点击下一页的时候。出现的结果应该也是正常的才对这是因为我点击查询完了以后，返回本页面的时候对课程进度下拉框进行数据回显。代码如下如果不进行数据回显会出现什么样的结果呢？就是你选择课程进度进行查询。查询完了以后。页面显示的结果是正确的。但是select下拉框默

select 下拉框 利用ajax获取后台数据，循环显示后台数据的三种格式任你选择。每种方式都是根据Ajax和layui，json 数据的操作。

qq_60443293的博客

11-08

2045

vue数据字典下拉框，要回显下拉列表中没有的值？

m0_50441807的博客

03-30

1350

由于自定义指令中的update钩子函数中无法知道接口的数据什么时候才返回，所以需要循环调用updateDom函数，里面是setTimeout，直到接口返回值的时候，才终止循环调用；思路：下拉框的回显，是根据下拉列表数组来回显的，假设下拉列表中没有该值，则无法回显；那么我们把不能回显的值也放到数组里面，只是显示下拉列表的时候隐藏，就可以达到回显的作用了；数据字典中有个enable字段，用于字典的启用和停用；// 这里写死200毫秒，实际后端响应是不确定的。：实际上拿到的是指令所在组件的实例对象；

从父页面点编辑的时候回显下拉框的数据回显不成功的问题

麦兜仪的博客

05-08

473

原来的写法在别的项目写是可以的不知道什么原因在这里就不可以不过还好在同事的帮助下换了另一种写法解决了成功的代码如下: 重点: $(’#status’).val(data.status) $(’#sex’).val(data.sex) <--下拉框HTML结构--> <div class="layui-form-item"> <label class="layui-form-label">性别</label> ..

jeesite 单选多选下拉框 回显效果实现

Senmitsuji的博客

10-14

2805

jeesite 非字典下拉多选框回显效果使用背景单选下拉框动态下拉列表生成及数据回显欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UM...

调用接口返回数据

送花给你的博客

10-12

2708

import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.InputStream; import java.io.InputStreamReader; import java.io.OutputStream; import java.io.OutputStreamWriter; import java.n

Ajax实现数据回显

酷小亚

09-10

1376

1、在pom.xml中导入依赖 2、在web.xml中配置文件 3、在springmvc中配置文件 4、实体类user 5、在Controller类中编写代码，展示到前端页面 6、jsp前端页面 7、显示效果

select2 ajax 获取数据并回显

weixin_41881346的博客

03-27

1329

select2 ajax 请求数据 $(dom).select2({ width: "100%", allowClear: true, ajax: { url: “/select2/info”, async: false, data...

select2 ajax动态获取数据并回显

wang710815126的博客

03-31

6285

有这样一个需求：给员工分配角色，首先要获得这个员工已拥有的角色，并且要获得所有的角色列表。具体效果如下实现步骤： 1.加载所有的角色列表因为是一个静态弹框，不能每次打开静态框的时候再发送请求加载角色列表，再页面初始化时应加载完成。 /** * 页面初始化 */ $(function () { ini...

easyui combobox 类选择器多个下拉框使用一个接口回显数据

探索丶挑战丶突破

08-09

533

参考原文：https://www.cnblogs.com/linvan/p/6949765.html easyui combobox 类选择器多个下拉框使用一个接口回显数据 HTML：当使用如下选择器来操作combobox对象时，会出现不同的表现。 JavaScript： $(‘input[name=myinputdom]’).combobox(…);//错误 $(’:input[nam...

Select2数据回显

u010012932的博客

08-24

5715

<select class="dggui-select" name="placeOrderUserId" id="placeOrderUserId"> </select> 多选分页数据回显方式初始化selet2 select2.render({ elem: $('#placeOrderUserId'), p...

Select2编辑数据回显，ajax方式加载数据