js获取select下拉框的value值和text文本值

摘要:
本文介绍了一种获取下拉框值并绑定下拉框数据的方法。这里使用的jquery-ui-multiselect插件是1。前台html代码category://隐藏控件用于存储sel

介绍一种取下拉框值以及绑定下拉框数据的方法    这里用到的jquery-ui-multiselect插件

 1、前台html代码

<span class="ModuleFormFieldLabel" style="float: left; padding-top: 3px;">品类:</span>
   <asp:HiddenField runat="server" ID="hidCarType" />  //隐藏控件,用来存放select value值,传到后台显示下拉数据用
   <select id="mulselCarType" name="mulselCarType" multiple="multiple">   //multiple为多选属性
     <%=this.htmlCarType %>   //后台绑定数据
   </select>

<asp:HiddenField ID="hid_Cartype" runat="server" />   //隐藏控件,用来存放select text文本值,传到后台显示文本值
   <asp:Label  ID="x_lb_Cartype" runat="server" Text="品类:" Visible="false"></asp:Label>
   <span style="white-space:normal;">
    <asp:Literal ID="lbCartype" runat="server" ></asp:Literal> //lable用来在页面显示文本值
  </span>

2、获取值js代码

function getValue() {        
            //获取text值传入后台
            var objType = $("#mulselCarType").find("option:selected");   //找到控件id,并且找到被选中的option
            var strType = [];   //定义数组
            for (var i = 0; i < objType.length; i++) {
                strType[i] = objType[i].text;   //循环option的长度,取到text值放入数组
            }
            document.getElementById('<%=hid_coust.ClientID %>').value = strType;   //将数组中的值放入隐藏控件(默认每个字符中间使用','隔开,英文',')

            //获取text值传入后台
            var objCarType = [];
            $("#mulselCarType").find("option:selected").each(function () {   
                objCarType.push($(this).text());      //找到id,找到选中的option,直接each遍历,将text值push到数组
            });
            document.getElementById('<%=hid_Cartype.ClientID %>').value = objCarType.join(",");    //将数组的值放入隐藏控件,join(","),字符中间用中文","隔开

        
            //获取value值传入后台
            var carType = [];     //multiselect是jquery-ui-multiselect插件,方法详见官方文档
            $("#mulselCarType").multiselect('getChecked').each(function () { carType.push($(this).val()); });
            document.getElementById("<%=hidCarType.ClientID %>").value = carType.join(",");
        };

3、后台取值赋值代码

     public string htmlCarType = string.Empty;

      //品类
        private void InitCarType()
        {
            if (!string.IsNullOrEmpty(hidAgent.Value))
            {
                using (SqlDBAccess dbAccess = new SqlDBAccess(AppFunction.ConnectionString))
                {
            //连接数据将数据从表取出,循环放入option,绑定下拉显示数据 DataTable dt = dbAccess.ExecuteTable("select agent_id,name from tb_agent where brand_id in (" + hidAgent.Value + ") and status='ready'"); System.Text.StringBuilder sb = new System.Text.StringBuilder(); foreach (DataRow dr in dt.Rows) { sb.AppendLine(string.Format("
<option value='{0}'>{1}</option>", dr["agent_id"].ToString(), dr["name"].ToString())); } this.htmlCarType = sb.ToString(); } } }

      //品类
      if (hid_Cartype.Value == "")     //将文本值放入lable控件显示
        x_lb_Cartype.Visible = false;
      else
        x_lb_Cartype.Visible = true;
        lbCartype.Text = hid_Cartype.Value;

 

js获取select下拉框的value值和text文本值第1张

免责声明:文章转载自《js获取select下拉框的value值和text文本值》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇几个常见规则引擎的简单介绍和演示Android 进度条下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

SQLServer数据库(二)

数据库设计:就是将数据库中的数据库实体及这些数据库实体之间的关系,进行规划和结构化的过程。 项目开发过程: 需求分析 概要设计 详细设计 代码编写 运行测试 打包发行 数据库的系统分析基本步骤:收集信息、标识实体、标识每个实体需要存储的详细信息、标识实体之间的关系。 实体,就是指现实世界中具有区分其它事物的特征或属性,并与其他实体有联系的实体。实体一般是名...

使用select实现非阻塞socket | dbafree首页

使用select实现非阻塞socket | dbafree首页 在linux,perl,python上都存在select系统调用。下面这两个python程序,可以用来学习和调试select操作。 参考至:http://blog.chinaunix.net/space.php?uid=199788&do=blog&id=99434 1.服务...

关于webpack打包js和css

废话不多说,直接贴出代码,大家瞅瞅:其中要引用css的话是要用css-loader。用了之后再webpack。config。js里面配置相应的代码,并且在相应的js文件里面引用即可啦,不知道有哪位大神指导我的webstorm为什么不支持es6的写法吗?我试了很多方法和设置,都没用,但是整个项目部报错,- -!!!!...

js中的DOM节点操作---增删改查

查找节点 getElementById(),getElementsByClassName(),getElementsByTagName() querySelector(),querySelectorAll() 创建节点 createElement():创建一个dom节点 示例代码 document.createElement('div'); 插入节点 a...

Oracle系统表大全(转)

下面全面是对Oracle系统表的一些介绍: 数据字典dict总是属于Oracle用户sys的。   1、用户:    select username from dba_users;   改口令    alter user spgroup identified by spgtest;   2、表空间:    select * from dba_data_fi...

数据库概述及基本操作

目录:数据库概述           SQL Sever的简介 数据库概述       数据库是相关的多维数据集及其所共享的对象的容器。这些对象包括数据源(表)、表、视图、规则、角色、存储过程、自定义函数等。如果多个多维数据集要共享这些对象,那么这些对象和多维数据集必须在同一个数据库中。简单来说,数据库就是管理数据的地方。  数据库的发展阶段:层次型、网...