Fatal编程技术网
  • jquery/
  • Jquery 选中top复选框时，jqGrid multiselect仅提供ID？

Jquery 选中top复选框时，jqGrid multiselect仅提供ID？

jquery jqgrid

Jquery 选中top复选框时，jqGrid multiselect仅提供ID？,jquery,jqgrid,Jquery,Jqgrid,我有一个带有multiselect的jqGrid:true。在按钮的单击事件中，我尝试检索ID，如： var ids = $('#myGrid').jqGrid('getGridParam', 'selarrrow'); 但是，如果我在标题中选择顶部复选框，我只会在ID中填充一些内容。如果我没有在标题中选择该项，但在列中选择了多个复选框，则ID中没有选定的ID。如何克服这个问题 SellarRow是根据这个正确编写的示例编写的：，选择高级、多选示例。我使用下面的代码检索随机选择的行及其工作细节

我有一个带有multiselect的jqGrid:true。在按钮的单击事件中，我尝试检索ID，如：

var ids = $('#myGrid').jqGrid('getGridParam', 'selarrrow');
但是，如果我在标题中选择顶部复选框，我只会在ID中填充一些内容。如果我没有在标题中选择该项，但在列中选择了多个复选框，则ID中没有选定的ID。如何克服这个问题

SellarRow是根据这个正确编写的示例编写的：，选择高级、多选示例。

我使用下面的代码检索随机选择的行及其工作细节

var selArr = $("#my_grid").getGridParam("selarrrow");
原来是一个默认设置，其中设置了：

beforeSelectRow: function(rowid, e) { return false; },
将其设置为true会使我恢复电源。

如果我将

$('#id ').getGridParam('selectarrow')
而不是

$('# ').JQgrid('getGridParam','selectarrow')
它可以在选择行之前添加行：取消行单击选择

属性转换为jq网格。功能定义如下所示。它工作得很好

function cancelRowClickSelection(rowid, e) 
{
 var target=e.originalTarget;
 var str=target.innerHTML;
 if(target.classList!=null && target.classList!="undefined" && target.classList[0]!=null && target.classList[0]!="undefined")
 {
  if(target.classList[0]=="cbox")
  {
   return true;
  }
 }
 if(str.indexOf("input")!=-1 || str.indexOf("INPUT")!=-1)
 {
  return true;
 }
 return false; 
}
我尝试了几种解决方案，但运气不佳。 这就是我最终得到的-只是找到数据值

完整的独立示例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <link type="text/css" rel="stylesheet" media="screen" href="jqGrid4/css/redmond/jquery-ui-1.8.13.custom.css" />
    <link type="text/css" rel="stylesheet" media="screen" href="jqGrid4/css/ui.jqgrid.css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script type="text/javascript" src="jqGrid4/js/i18n/grid.locale-en.js"></script>
    <script type="text/javascript" src="jqGrid4/js/jquery.jqGrid.min.js"></script>
</head>
<body>

<form id="gridFIRST" action="A" method="post">
    <input id="gridFIRST_thinglist" name="gridFIRST[thinglist]" type="hidden" value="">
    <input id="gridFIRST_X"  name="gridFIRST[do_X]" type="submit" value="Let Out 0">
</form>
<form id="gridSECOND" action="B" method="post">
    <input id="gridSECOND_thinglist"  name="gridSECOND[thinglist]" type="hidden" value="">
    <input id="gridSECOND_Y" name="gridSECOND[do_Y]" type="submit" value="Bring In 0">
</form>
<table summary="grid" id="thisJqGrid"></table>
<div id="thisJqGridPager"></div>


<script>
function selectedThingsClass()
    {
    this.list = new Array();
    this.dpush = function(thing) { if(this.list.indexOf(thing) == -1) /* if unique */ this.list.push(thing); }
    this.dpop = function (thing) { var n = this.list.indexOf(thing); if(n >= 0) this.list.splice(n, 1); }
    this.getCount = function () { return 0+this.list.length; }
    this.thingSelected = function (isChecked,thing) { if(isChecked) this.dpush(thing); else this.dpop(thing); }
    }

function handleSelectedRow(thing) {
    var jqgcell     = jQuery('#thisJqGrid').getCell(thing, 0);
    var petName     = jQuery('#thisJqGrid').getCell(thing, 'COL2');
    var cbIsChecked = (jQuery(jqgcell).attr('checked') == 'checked') ? true : false;
    switch(petName)
        {
        case 'Dog':
            selectedThingsCat.thingSelected(cbIsChecked,thing);
            jQuery('#gridSECOND_thinglist').val(selectedThingsCat.list.toString());
            jQuery('#gridSECOND_Y').val("Bring In "+selectedThingsCat.getCount());
            break;
        case 'Cat':
            selectedThingsDog.thingSelected(cbIsChecked,thing);
            jQuery('#gridFIRST_thinglist').val(selectedThingsDog.list.toString());
            jQuery('#gridFIRST_X').val("Let Out "+selectedThingsDog.getCount());
            break;
        }
    }

var selectedThingsDog = new selectedThingsClass();
var selectedThingsCat = new selectedThingsClass();

function index_handleSelectedRow(rowIndex)
    {
    // convert row-index to JSON-Data ID
    var rowDataArr = jQuery("#thisJqGrid").getRowData();
    handleSelectedRow(rowDataArr[rowIndex].COL1);
    }

var mydata = [
    {id:"thing01",COL1:"thing01",COL2:"Dog"},
    {id:"thing02",COL1:"thing02",COL2:"Cat"},
    {id:"thing03",COL1:"thing03",COL2:"Cat"},
    {id:"thing04",COL1:"thing04",COL2:"Dog"},
    {id:"thing05",COL1:"thing05",COL2:"Cat"},
    {id:"thing06",COL1:"thing06",COL2:"Dog"},
    {id:"thing07",COL1:"thing07",COL2:"Cat"},
    {id:"thing08",COL1:"thing08",COL2:"Cat"},
    {id:"thing09",COL1:"thing09",COL2:"Dog"},
    {id:"thing10",COL1:"thing10",COL2:"Dog"}
    ];

jQuery(document).ready(function($){
    jQuery("#thisJqGrid").jqGrid({
            onSelectAll: function(rowIdxArray, sts)
                { jQuery(rowIdxArray).each(function(rowIndex){ index_handleSelectedRow(rowIndex); } ); },
            onSelectRow: function(rowJsonId)
                { handleSelectedRow(rowJsonId); },
            multiselect: true,
            colNames:[ 'Thing','Pet' ],
            colModel: [ { name:'COL1', width:10 }, { name:'COL2', width:10 }, ],
            datatype: "local", data: mydata,
            width: "200", height: "100%",
            postData: { "oper":"grid" },
            toolbar: [true,"top"],
            rowNum:10,
            sortname: "COL1",
            sortorder: "asc",
        });
    });

</script>
</body>
</html>


函数selectedThingClass（）
{
this.list=新数组（）；
this.dpush=function（thing）{if（this.list.indexOf（thing）=-1）/*if-unique*/this.list.push（thing）；}
this.dpop=function（thing）{var n=this.list.indexOf（thing）；if（n>=0）this.list.splice（n，1）；}
this.getCount=函数（）{return 0+this.list.length；}
this.thingSelected=函数（isChecked，thing）{if（isChecked）this.dpush（thing）；else this.dpop（thing）；}
}
函数handleSelectedRow（对象）{
var jqgcell=jQuery（'#thisJqGrid'）.getCell（thing，0）；
var petName=jQuery（'#thisJqGrid'）.getCell（thing，'COL2'）；
var cbIsChecked=（jQuery（jqgcell）.attr（'checked'）='checked'）？true:false；
开关（petName）
{
“狗”案：
选择thingscat.thingSelected（cbIsChecked，thing）；
jQuery（'#gridSECOND_thinglist'）.val（selectedThingsCat.list.toString（））；
jQuery（'#gridSECOND_Y'）.val（“引入”+selectedThingsCat.getCount（））；
打破
“猫”一案：
选择ThingsDog.thingSelected（cbIsChecked，thing）；
jQuery（'#gridFIRST_thinglist'）.val（selectedThingsDog.list.toString（））；
jQuery（'#gridFIRST_X'）.val（“Let Out”+selectedThingsDog.getCount（））；
打破
}
}
var selectedThingsDog=new selectedthingclass（）；
var selectedThingsCat=new selectedthingclass（）；
函数索引\u handleSelectedRow（行索引）
{
//将行索引转换为JSON数据ID
var rowDataArr=jQuery（#thisJqGrid”）.getRowData（）；
handleSelectedRow（rowDataArr[rowIndex].COL1）；
}
var mydata=[
{id:“thing01”，COL1:“thing01”，COL2:“Dog”}，
{id:“thing02”，COL1:“thing02”，COL2:“Cat”}，
{id:“thing03”，COL1:“thing03”，COL2:“Cat”}，
{id:“thing04”，COL1:“thing04”，COL2:“Dog”}，
{id:“thing05”，COL1:“thing05”，COL2:“Cat”}，
{id:“thing06”，COL1:“thing06”，COL2:“Dog”}，
{id:“thing07”，COL1:“thing07”，COL2:“Cat”}，
{id:“thing08”，COL1:“thing08”，COL2:“Cat”}，
{id:“thing09”，COL1:“thing09”，COL2:“Dog”}，
{id:“thing10”，COL1:“thing10”，COL2:“Dog”}
];
jQuery（文档）.ready（函数（$）{
jQuery（“thisJqGrid”）.jqGrid({
onSelectAll:函数（rowIdxArray、sts）
{jQuery（rowIdxArray）.each（函数（rowIndex）{index_handleSelectedRow（rowIndex）；}）}，
onSetRow:函数（rowJsonId）
{handleSelectedRow（rowJsonId）；}，
多选：对，
colNames:['Thing'，'Pet']，
colModel:[{name:'COL1'，width:10}，{name:'COL2'，width:10}，]，
数据类型：“本地”，数据：mydata，
宽度：“200”，高度：“100%”，
postData:{“oper”：“grid”}，
工具栏：[正确，“顶部”]，
rowNum:10，
sortname:“COL1”，
分拣员：“asc”，
});
});
您是否注意到拼写错误了
selarrow
？我也这么认为，但当我尝试时，一切都不起作用了。此外，我觉得奇怪的是，即使拼写错误，顶部复选框仍然有效。@Craig Stuntz:实际上，它是
selarrrow
。我猜它来自“选定的数组行”：