zoukankan      html  css  js  c++  java
  • jqGrid 实现这种select 同一列的不同行的select 的option 不同

    jqGrid 的简介

    jqgrid 是一个基于jquery 的web 端 table/tree grid 的组件。

    官方网址:

    http://www.jqgrid.com


    默认的select 定义方式

    {name:'ship',index:'ship', 90, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX"}}
    默认的定义方式是在grid 的定义选项中设置 colModel 的col 定义按照以上的定义方式。
    FE:FedEx ==> 冒号前面是value , 后面是显示的text.

    这样的设定后, 一列下面所有的此栏位的下拉单的选项都是一样的。如何设定各行此栏位的选项不一致呢?
    datatype 为非 local 的状况没有考虑过, 如果为local 的实现如下:


    客制实现

    colModel 中的定义

    {name:'note',index:'note', editable:true,edittype:'custom', editoptions:{custom_element: myelem, custom_value:myvalue},150, sortable:false} ]

    javascript function 定义
    function myelem(value, options) {
    var el = document.createElement("select");
    if(value!=null&&value.length>0)
    {
    	  var optvalues = eval(value);
    	  if(optvalues.length>0)
    	  {
    		  for(var i=0;i<optvalues.length;i++)
    	      {
    			  var optvalue = optvalues[i].optvalue;
    			  var optdisplay = optvalues[i].optdisplay;
    			  var optel = document.createElement("option");
    			  optel.innerHTML = optdisplay;
    			  optel.value = optvalue;
    			  el.appendChild(optel);
    	      }
    	  }
    }
    return el;
    }
    
    function myvalue(elem, operation, value) {
      if(operation === 'get') {
      	return $(elem).val();
      } else if(operation === 'set') {
      	$(elem).val(value);
      }
    }
    

    data 的添加时, 此栏位的值以json 格式赋值: 像
    {optvalue:'value',optdisplay:'display'}




  • 相关阅读:
    《JAVA设计模式》之责任链模式(Chain of Responsibility)
    《JAVA设计模式》之迭代器模式(Iterator)
    《JAVA设计模式》之观察者模式(Observer)
    【python】effective python读书笔记
    【python】contextlib的使用
    【linux】乱七八糟命令
    【深度学习】使用Ray
    【深度学习】超参调节方式:Bayesian Opt
    【linux】scp不需要输入密码的方法
    【深度学习】论文TCN
  • 原文地址:https://www.cnblogs.com/javawebsoa/p/3035971.html
Copyright © 2011-2022 走看看