Jqgrid 添加了一列自动填充。所以我就这样用。实际上,我有3个“选择”字段,并且我为它们包括了“空白/空字符串”过滤器,如-var saleIndStr=“:All;0:Launched;1:sall;2:Aborted;3:”,其中“3:”提供了过滤带有空“sal

Jqgrid 添加了一列自动填充。所以我就这样用。实际上,我有3个“选择”字段,并且我为它们包括了“空白/空字符串”过滤器,如-var saleIndStr=“:All;0:Launched;1:sall;2:Aborted;3:”,其中“3:”提供了过滤带有空“sal,jqgrid,Jqgrid,添加了一列自动填充。所以我就这样用。实际上,我有3个“选择”字段,并且我为它们包括了“空白/空字符串”过滤器,如-var saleIndStr=“:All;0:Launched;1:sall;2:Aborted;3:”,其中“3:”提供了过滤带有空“sale”列的行的选项。但对于我们新的文本框自定义过滤器,我无法做到这一点。@Sree:你所解释的完全是另一个独立于另一个问题的问题。您设置了一些特殊要求,一次复制多行,因此无法筛选新的尚未填充的行。如果您只添加/复制一行,您可能根本不会有任何问题。


添加了一列自动填充。所以我就这样用。实际上,我有3个“选择”字段,并且我为它们包括了“空白/空字符串”过滤器,如-var saleIndStr=“:All;0:Launched;1:sall;2:Aborted;3:”,其中“3:”提供了过滤带有空“sale”列的行的选项。但对于我们新的文本框自定义过滤器,我无法做到这一点。@Sree:你所解释的完全是另一个独立于另一个问题的问题。您设置了一些特殊要求,一次复制多行,因此无法筛选新的尚未填充的行。如果您只添加/复制一行,您可能根本不会有任何问题。另一种方法是在选择中包含一个附加值“未知”。还有一种可能性是使用布尔值添加一个隐藏行。填充roew的隐藏列的值可以是
true
,新行的隐藏列的值可以是
false
。在
afterSaveCell
中,您可以更改该值。
var sgrid = $("#list")[0];
sgrid.triggerToolbar();
<script type="text/javascript">
var mydata = [
        {id:"1", Name:"Miroslav Klose",     Category:"sport",   Subcategory:"football"},
        {id:"2", Name:"Michael Schumacher", Category:"sport",   Subcategory:"formula 1"},
        {id:"3", Name:"Albert Einstein",    Category:"science", Subcategory:"physics"},
        {id:"4", Name:"Blaise Pascal",      Category:"science", Subcategory:"mathematics"}
    ],
    grid = $("#list"),
    getUniqueNames = function(columnName) {
        var texts = grid.jqGrid('getCol',columnName), uniqueTexts = [],
            textsLength = texts.length, text, textsMap = {}, i;
        for (i=0;i<textsLength;i++) {
            text = texts[i];
            if (text !== undefined && textsMap[text] === undefined) {
                // to test whether the texts is unique we place it in the map.
                textsMap[text] = true;
                uniqueTexts.push(text);
            }
        }
        return uniqueTexts;
    },
    buildSearchSelect = function(uniqueNames) {
        var values=":All";
        $.each (uniqueNames, function() {
            values += ";" + this + ":" + this;
        });     
        return values;
    },
    setSearchSelect = function(columnName) {    
        grid.jqGrid('setColProp', columnName,
                    {
                        stype: 'select',
                        searchoptions: {
                            value:buildSearchSelect(getUniqueNames(columnName)),
                            sopt:['eq']
                        }
                    }
        );      
    };

grid.jqGrid({
    data: mydata,
    datatype: 'local',
    colModel: [
        { name:'Name', index:'Name', width:200 ,editable:true},
        { name:'Category', index:'Category', width:200,editable:true },
        { name:'Subcategory', index:'Subcategory', width:200,editable:true }
    ],
    sortname: 'Name',
    viewrecords: true,
    rownumbers: true,
    sortorder: "desc",
    editurl: "clientArray",
    multiselect: true,
    pagination:true,
    cellEdit: true,
    cellsubmit: 'clientArray',
    //ignoreCase: true,
    pager: '#pager',
    height: "auto",
    enableSearch: true,
    caption: "How to use filterToolbar better locally", 
    afterSaveCell: function(rowid,name,val,iRow,iCol) { 
        setSearchSelect(name);  

        jQuery("#list").('setColProp', name,
                    {
                       width:100
                    }
        );
        var sgrid = $("#list")[0];
        sgrid.triggerToolbar();
alert(name);        
    },
    loadComplete: function () {
                    setSearchSelect('Category');    
                }
}).jqGrid('navGrid','#pager',
          {edit:false, add:false, del:false, search:false, refresh:true});

setSearchSelect('Category');
setSearchSelect('Subcategory');

grid.jqGrid('setColProp', 'Name',
            {
                searchoptions: {
                    sopt:['cn'],
                    dataInit: function(elem) {
                        $(elem).autocomplete({
                            source:getUniqueNames('Name'),
                            delay:0,
                            minLength:0
                        });
                    }
                }
            });

grid.jqGrid('filterToolbar',
            {stringResult:true, searchOnEnter:true, defaultSearch:"cn"});


function addRow(tableId){
    var loopRow = document.getElementById("addRowsInput").value;                
    var recordCount = '';
    var rwData = '';
    //var selRowIds = getRowIDs('list');
    var gridProducts =  $("#list"); 
    var resetFirstRow = jQuery("#list").getRowData( 1 );
    jQuery("#list").setRowData( 1, resetFirstRow );
    if(loopRow == null || loopRow == "" || loopRow == "Enter number of units to be added")
    {
        loopRow = 1;
    }

        for(i=0; i< loopRow; i++)
        {       
                recordCount = jQuery("#list").getGridParam("records") ;
                var emptydata = [
                    {id:(recordCount+1), Name:"",     Category:"",   Subcategory:""}]
                    gridProducts.jqGrid('addRowData', recordCount+1, emptydata[0]);                                 
        }
    }
</script>
var mydata = [
        {id:"1", Name:"Miroslav Klose",     Category:"sport",   Subcategory:"football"},
        {id:"2", Name:"Michael Schumacher", Category:"sport",   Subcategory:"formula 1"},
        {id:"3", Name:"Albert Einstein",    Category:"science", Subcategory:"physics"},
        {id:"4", Name:"Blaise Pascal",      Category:"science", Subcategory:"mathematics"}
    ],
    grid = $("#list"),
    getUniqueNames = function(columnName) {
        var texts = grid.jqGrid('getCol',columnName), uniqueTexts = [],
            textsLength = texts.length, text, textsMap = {}, i;
        for (i=0;i<textsLength;i++) {
            text = texts[i];
            if (text !== undefined && textsMap[text] === undefined) {
                // to test whether the texts is unique we place it in the map.
                textsMap[text] = true;
                uniqueTexts.push(text);
            }
        }
        uniqueTexts.sort();
        return uniqueTexts;
    },
    buildSearchSelect = function(uniqueNames) {
        var values=":All";
        $.each (uniqueNames, function() {
            values += ";" + this + ":" + this;
        });
        return values;
    },
    setSearchSelect = function(columnName) {
        var $select = $('select#gs_'+columnName), un = getUniqueNames(columnName),
            htmlForSelect = '<option value="">All</option>', i, l=un.length, val;
        grid.jqGrid('setColProp', columnName,
                    {
                        stype: 'select',
                        searchoptions: {
                            value:buildSearchSelect(un),
                            sopt:['eq']
                        }
                    }
        );
        if ($select.length > 0) {
            // The searching toolbar already exist. One have to update it manually
            for (i=0;i<l;i++) {
                val = un[i];
                htmlForSelect += '<option value="'+val+'">'+val+'</option>';
            }
            $select.html(htmlForSelect);
        }
    },
    setAutocomplete = function(columnName) {
        var $input = $('input#gs_'+columnName), un = getUniqueNames(columnName);
        grid.jqGrid('setColProp', columnName,
                    {
                        searchoptions: {
                            sopt:['cn'],
                            dataInit: function(elem) {
                                $(elem).autocomplete({
                                    source:un,
                                    delay:0,
                                    minLength:0
                                });
                            }
                        }
                    });
        if ($input.length > 0) {
            // The searching toolbar already exist. One have to update the source
            $input.autocomplete('option', 'source', un);
        }
    },
    selectColumns = ['Category','Subcategory'], autocompleteColumns = ['Name'];

grid.jqGrid({
    data: mydata,
    datatype: 'local',
    colModel: [
        { name:'Name', index:'Name', width:200 ,editable:true},
        { name:'Category', index:'Category', width:200,editable:true },
        { name:'Subcategory', index:'Subcategory', width:200,editable:true }
    ],
    sortname: 'Name',
    viewrecords: true,
    rownumbers: true,
    sortorder: "desc",
    cellEdit: true,
    cellsubmit: 'clientArray',
    ignoreCase: true,
    pager: '#pager',
    height: "auto",
    caption: "How to use filterToolbar better locally including local cell editing",
    afterSaveCell: function(rowid,name,val,iRow,iCol) {
        if ($.inArray(name,selectColumns) !== -1) {
            setSearchSelect(name);
        } else if ($.inArray(name,autocompleteColumns) !== -1) {
            setAutocomplete(name);
        }
    }
}).jqGrid('navGrid','#pager',
          {edit:false, add:false, del:false, search:false, refresh:true});

$.each(selectColumns,function() {
    setSearchSelect(String(this));
});

$.each(autocompleteColumns,function() {
    setAutocomplete(String(this));
});

grid.jqGrid('filterToolbar',
            {stringResult:true, searchOnEnter:true, defaultSearch:"cn"});