2

JqG​​ridの行/列データを「ダーティ」として強制する方法はありますか？

をチェックするたびに.getChangedCells('dirty')、変更されていない行を追加したいので、このメソッドを使用して返されることはありません。

私が欲しいのは、行/列データを強制的にダーティとしてマークすることです。これにより、このメソッドを呼び出すたびに、その行も返されます。

私のjqgridデータは：

var mydata = [      
    {id:"1",blkNo:"101",floorNo:"04",unitNo:"184",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Draft",saleInd:0,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"2,"blkNo:"101",floorNo:"04",unitNo:"184",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Draft",saleInd:0,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"3",blkNo:"101",floorNo:"04",unitNo:"184",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Draft",saleInd:0,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"4",blkNo:"101",floorNo:"04",unitNo:"185",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Submitted",saleInd:0,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"5",blkNo:"101",floorNo:"04",unitNo:"186",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Submitted",saleInd:0,propertyType:2,leastPrice:"200000",leastPricePSF:"200"},
    {id:"6",blkNo:"101",floorNo:"04",unitNo:"187",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Submitted",saleInd:0,propertyType:3,leastPrice:"200000",leastPricePSF:"200"},
    {id:"7",blkNo:"101",floorNo:"04",unitNo:"188",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"",dateAborted:"",unitStatus:"Submitted",saleInd:0,propertyType:3,leastPrice:"200000",leastPricePSF:"200"},
    {id:"8",blkNo:"101",floorNo:"04",unitNo:"189",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:1,purchaserDtail:0,propertyType:0,leastPrice:"200000",leastPricePSF:"200"},
    {id:"9",blkNo:"101",floorNo:"04",unitNo:"190",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:1,purchaserDtail:0,propertyType:0,leastPrice:"200000",leastPricePSF:"200"},
    {id:"10",blkNo:"101",floorNo:"05",unitNo:"191",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:1,purchaserDtail:1,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"11",blkNo:"101",floorNo:"05",unitNo:"192",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:1,purchaserDtail:2,propertyType:2,leastPrice:"200000",leastPricePSF:"200"},
    {id:"12",blkNo:"101",floorNo:"05",unitNo:"193",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:2,purchaserDtail:2,propertyType:2,leastPrice:"200000",leastPricePSF:"200"},
    {id:"13",blkNo:"102",floorNo:"01",unitNo:"183",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:2,purchaserDtail:1,propertyType:1,leastPrice:"200000",leastPricePSF:"200"},
    {id:"14",blkNo:"102",floorNo:"02",unitNo:"184",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:2,purchaserDtail:0,propertyType:0,leastPrice:"200000",leastPricePSF:"200"},
    {id:"15",blkNo:"103",floorNo:"03",unitNo:"183",area:"1000",streetName:"Peck Seah Street",interested:"Yes",price:"3000000",pricePSF:"3000",dateofLaunch:"2011-05-05",dateofSale:"2011-05-10",dateAborted:"2011-05-15",unitStatus:"Submitted",saleInd:2,purchaserDtail:0,propertyType:1,leastPrice:"200000",leastPricePSF:"200"}
];

これが私のgetModifiedRows方法です：

function getModifiedRows() {
    var allRowsInGrid = $('#list4').jqGrid('getRowData');

    for(j=0; j< allRowsInGrid.length;j++) 
    {
        if( allRowsInGrid[j]['unitStatus'] == 'Draft')
        { 
            var rowId = allRowsInGrid[j]['id'];   
            $('#list4').addClass("dirty-cell");     
            $("#list4").jqGrid("setCell", rowId ,'pricePSF' ,'', "dirty-cell");
        }
    }

    var retRows = $('#list4').getChangedCells('all');
    var retCol = $('#list4').getChangedCells('dirty');
    var entireGrid = $("#list4").jqGrid('getGridParam','colNames');

    if(retCol != '' && retRows != '')
    {
        alert(retCol);
        for(i=0; i< retCol.length;i++)
        {
            var obj = retCol[i];
            obj['row_Index']= retRows[i]['row_Index'];
            obj['unitStatus']= retRows[i]['unitStatus'];
            obj['pricePSF']= retRows[i]['pricePSF'];
            alert(retRows[i]['unitStatus']);
            if(retRows[i]['unitStatus'] == 'New')
            {
                retCol[i] = retRows[i];
            }
        }
        var modColData = JSON.stringify(retCol);    
        var modRows = JSON.stringify(retRows);
        document.getElementById("getGridData").value = modRows;
        document.getElementById("getModColData").value = modColData;
    }
}

このコードからエラーは発生しませんが、以下のコード内にこの行は表示されません。

var retCol = $('#list4').getChangedCells('dirty');

getModifiedRowsで明らかなように、すべてのユニットunitStatus = Draftがで返されるようにしたい

var retCol = $('#list4').getChangedCells('dirty');

次のように、この列にハードコードされた値を渡すと、値が変更されることがわかります。

$("#list4").jqGrid("setCell", rowId ,'pricePSF' ,'200', "dirty-cell");

しかし、私はまだ変更された内部でそれを取得することはできません

var retCol = $('#list4').getChangedCells('dirty');

これは私のcolNamesとcolModel：

colNames:['S No','Block No','Floor No', 'Unit No', 'Street Name',' 6- Digit Postal Code' ,'Trans Id','Address','Property Type','Area (sqm)','Date of Option Issued','Nett Transacted Price ($)','Gross Transacted Price ($)','Transacted Unit Price ($psf)','Nationality Of Buyer','Interested Party Transaction','Date of Option Aborted','Unit Status','listPriceFilter','salePriceFilter','sale_Date_Filter','aborted_Date_Filter','row_Index'],
//column no [1    2           3          4          5              6              7         8         9               10      11            12            13            14                        15                         16                               17                 18           19              20                      21              22                     23
colModel:[
    {name:'id', index:'id', width:40, align:"center", sorttype:"int"},
    {name:'blkNo', index:'blkNo', width:40, align:"center", sorttype:"text", sortable:true, editable:true, editrules:{custom:true, custom_func:mandatoryChk}}, 
    {name:'storey', index:'storey', align:"center", width:40, sorttype:"text", sortable:true, editable:true,  editrules:{custom:true, custom_func:storeyCheck}},    
    {name:'unit_No',index:'unit_No', width:40, align:"center", sorttype:"text", editable:true, editrules:{custom:true, custom_func:checkUnit}, onblur: 'submit'},
    {name:'street_Name', index:'street_Name', width:60, align:"center", sorttype:"text", editable:true, editrules:{required:true}},  
    {name:'postal_code', index:'postal_code', width:60, align:"center", sorttype:"text", editable:true, editrules:{custom:true, custom_func:postalCode}},  
    // {name:'postal_code', index:'postal_code', width:60, align:"center", sorttype:"text", editable:true, editrules:{custom:true}},  
    {name:'trans_Id', index:'trans_Id', width:60, align:"center", sorttype:"text", editable:false},  
    {name:'address', index:'address', width:60, align:"center", sorttype:"text", editable:false},  
    {name:'property_Type', index:'property_Type', align:"center", width:80, sortable:true, editable:true, edittype:"select", editoptions:{value:pptyTypeStr}, formatter:'select', stype: 'select'},                 
    {name:'area', index:'area', width:50, align:"center", sorttype:"integer", editable:true, editrules:{custom:true, custom_func:myAreaCheck, number:true, required:true}},
    {name:'sale_Date', index:'sale_Date', align:"center", width:75, sorttype:"date", sortable:true, editable:true, editoptions: {
        dataInit: function (element) {
            $(element).datepicker({
                dateFormat:"dd/mm/yy",
                onSelect: function(dateText, inst) { 
                    var $input = inst.input; // the datepicker input
                    var $row = $input.parents("tr"); 
                    $("#list4").jqGrid('saveRow',$row.attr("id"), false); 
                }
            });
        }
    }},  
    //  {name:'nett_Price', index:'nett_Price', width:80, align:"center", sorttype:"currency", formatter: 'currency',formatoptions: {  thousandsSeparator: ", " , decimalPlaces: 0, defaultValue: ''  }, editable:true , editrules:{custom:true, custom_func:mynettpricecheck , number:true} },    
    {name:'nett_Price', index:'nett_Price', width:80, align:"center", sorttype:"text", editable:true, editrules:{custom:true, custom_func:mynettpricecheck }},
    // {name:'sale_Price', index:'sale_Price', width:80, align:"center", sorttype:"currency", formatter: 'currency', formatoptions: {  thousandsSeparator: ", " , decimalPlaces: 0}, editable:true ,editrules:{custom:true, custom_func:mypricecheck,number:true}},
    {name:'sale_Price', index:'sale_Price', width:80, align:"center", sorttype:"text", editable:true},
    {name:'pricePSF', index:'pricePSF', width:80, align:"center", sorttype:"text", editable:false},
    {name:'nationality_Code', index:'nationality_Code', width:80, align:"center", editable:true, sortable:true, edittype:"select", formatter:'select', stype: 'select', searchoptions:{
            sopt: ['eq'],
            dataInit: function(el){
                var defOption = $("option:contains("+defaultCategory+")",el);
                defOption.attr("selected", "selected");
                setTimeout(function(){
                    $(el).trigger('change');
                },500);
            }
        },
        sorttype: function(cell, obj) {
            return purchaserDtail[cell];
        },
        editoptions:{value:purchaserDtailStr}
    },          
    {name:'interested', index:'interested', align:"center",width:70, sortable:true, editable:true, edittype:"select", formatter:'select', stype: 'select', editoptions:{value:interestedStr}},
    {name:'dateAborted', index:'dateAborted', align:"center", width:75, sorttype:"date", sortable:true, editable:true,
        editoptions: {
            dataInit: function (element) {
                $(element).datepicker({
                    dateFormat:"dd/mm/yy",
                    onSelect: function(dateText, inst) { 
                        var $input = inst.input; // the datepicker input
                        var $row = $input.parents("tr"); 
                        $("#list4").jqGrid('saveRow',$row.attr("id"), false);
                    }
                });
            }
        }
    },
    {name:'unitStatus', index:'unitStatus', align:"center", width:60, sortable:true, editable:false},
    {name:'listPriceFilter', index:'listPriceFilter', align:"center", width:40, editable:false},
    {name:'salePriceFilter', index:'salePriceFilter', align:"center", width:40, editable:false},
    {name:'sale_Date_Filter', index:'sale_Date_Filter', align:"center", width:40, editable:false},
    {name:'aborted_Date_Filter', index:'aborted_Date_Filter', align:"center", width:40, editable:false},
    {name:'row_Index', index:'row_Index', align:"center", width:40, editable:false, key:true}
],
4

1 に答える 1

1

「ダーティ」としてマークしたい"dirty-cell"セル（要素）にクラスを追加するだけです。<td>たとえば、setCellメソッドを使用して、rowidと列名で指定されたセルにクラスを追加できます。

$("#yourGridId").jqGrid("setCell", rowid, "columnName", "", "dirty-cell");

更新：あなたは間違った方法であなたの質問を定式化します。このメソッドは、セル編集getChangedCellsとのみ連携して機能します。セル編集モードで編集するすべてのセルは、セルの変更を保存した後にクラスを取得します。行はさらにクラスを取得します。メソッドはファクトを使用します。"dirty-cell""edited"getChangedCells

後で投稿したコードは、インライン編集の一部であるsaveRowメソッドを使用していることを示しています。セル編集とインライン編集を1つのグリッドに混在させることはできません。

使用する完全なコードを投稿していません。そのため、どの編集モードを使用するかはわかりません。セル編集を使用する場合は、saveRowの代わりにsaveCellを使用するようにコードを変更する必要があります。さらに、一部のセルを「ダーティセル」としてマークする必要がある場合は、行を「ダーティセル」としてマークする必要があります。

var $grid = $("#yourGridId");
$($grid[0].rows.namedItem(rowid)).addClass("edited");
$grid.jqGrid("setCell", rowid, "columnName", "", "dirty-cell");

また

var $grid = $("#yourGridId");
$("#" + $.jgrid.jqID(rowid)).addClass("edited");
$grid.jqGrid("setCell", rowid, "columnName", "", "dirty-cell");

その後、getChangedCellsメソッドを使用できるようになります。

セル編集の代わりにインライン編集を使用したい場合は、を使用することはできませんが、属性を持つ行（要素）をgetChangedCells列挙することはできます。編集されたすべての行にクラスが追加されます。属性の値が「1」の場合、行は現在編集中であり、saveRowメソッドを呼び出して変更を保存する必要があります。属性の値が「0」の場合、その行は以前に編集されており、「ダーティ」と解釈できます。属性のない行は、インライン編集に関して編集されていません。<tr>editableeditable

于 2013-02-05T08:55:32.250 に答える