free-jqgrid搜索按钮不起作用onclick

时间:2015-10-28 15:55:23

标签: search jqgrid free-jqgrid

我有一个产品网格,我现在在搜索工作,当我点击放大镜时,我在grid.addons.js文件中收到错误:

oprtr[j] = {op:stempl[j],text: p.odata[j].text};
Uncaught TypeError: Cannot read property '0' of undefined.

我确信这是因为我正在做的事情,有人可以查看我的网格并告诉我它为什么不起作用吗?

$("#productsTable").jqGrid({
    data: parsedResult,
    datatype: "local",
    loadonce: true,
    height: 'auto',
    marginLeft: 'auto',
    colNames: [
        'Product Id', 'Add', 'Product Name', 'Product Code', 'Customer Price'
    ],
    colModel: [
        { name: 'Id', width: 0, hidden:true },
        { name: "actions", template: "actions", width: 50, formatoptions:{
                delbutton: false,
                editbutton: false
        } },
        { name: 'Name', index: 'Name', width: 550, searchoptions:{sopt:['eq','bw','bn','cn','nc','ew','en']} },
        { name: 'ProductCode', index: 'ProductCode', width: 150, searchoptions:{sopt:['eq','bw','bn','cn','nc','ew','en']} },
        { name: 'Price', index: 'Price', width: 100, formatter: 'currency', formatoptions:{decimalSeparator:".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$"},
            searchoptions:{sopt:['eq','ne','le','lt','gt','ge']}}
    ],
    rowNum: 15,
    rowList: [5, 10, 15, 20],
    pager: true,
    gridView: true,
    viewrecords: true,
    iconSet: "jQueryUI",
    sortname: 'Name',
    sortorder: 'asc',
    inlineEditing: { keys: false },
    search: true,
    actionsNavOptions: {
            addToCarticon: "ui-icon-cart",
            addToCarttitle: "Add item to the cart",
            custom: [
                { action: "addToCart", position: "first", onClick: function (options) { 
                    var rowData = $('#productsTable').getRowData(options.rowid);
                    var cartButton = $(".ui-icon", "#jAddToCartButton_"+options.rowid);
                    if(cartButton.hasClass("ui-icon-cancel")){
                        cart.shift(rowData);
                        cartButton.removeClass("ui-icon-cancel");
                        cartButton.addClass("ui-icon-cart");
                    }
                    else if(cartButton.hasClass("ui-icon-cart")){
                        cart.push(rowData);
                        cartButton.removeClass("ui-icon-cart");
                        cartButton.addClass("ui-icon-cancel");
                    }
                }
            }]
        },
    loadComplete: function() {
                $("#add-product-dialog-loading-message").hide();
                $(".spinner").hide();
                $("#add-product-dialog-form").dialog("open");

                //for each object in cart
                //if product ID matches product Id in product 
                //grid then set button to a cancel icon
                if(cart.length !== 0){
                    var cartIds = [];
                    var jsonCart = JSON.stringify(cart);
                    var parsedJsonCart = JSON.parse(jsonCart);
                    var productsInCart = $.grep(parsedJsonCart, function(el,i){
                        cartIds.push(el.Id);
                    });

                    var currentRows = $('#productsTable').getRowData();
                    var shownProductsThatAreInCart = $.grep(currentRows, function (el, i) {
                            return $.inArray(el.Id, cartIds) !== -1;
                    });

                        if(shownProductsThatAreInCart.length > 0){
                                var rowIds = $(this).jqGrid('getDataIDs');
                                $.each(rowIds, function(k, v) {
                                        rowData = $('#productsTable').getRowData(v);

                                if($.inArray(rowData['Id'], cartIds) !== -1){
                                    alert("Matched Product:\nRowData['id'] = " + rowData['Id'] + "\nto\nProduct in cart: " + cartIds.Id);
                                    $(".ui-icon", "#jAddToCartButton_"+v).removeClass("ui-icon-cart");
                                    $(".ui-icon", "#jAddToCartButton_"+v).addClass("ui-icon-cancel");
                                }
                            });
                        }
                    }
                },
                gridComplete: function() {
                }
        });
        $("#productsTable").jqGrid("navGrid", {edit:false,add:false,del:false}).jqGrid("filterToolbar", {searchOperators : true});

我的包括:

value="https://code.jquery.com/jquery-1.10.2.min.js" />
value="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/jquery.ui-contextmenu/1.11.0/jquery.ui-contextmenu.min.js" />

value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/js/jquery.jqgrid.min.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/js/i18n/grid.locale-en.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/grid.setcolumns.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/jquery.contextmenu.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/jquery.searchfilter.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/ui.multiselect.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/grid.postext.js" />
value="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.9.2/plugins/grid.addons.js" />

谢谢!

1 个答案:

答案 0 :(得分:1)

您应该删除$('td.ms-vb2').each(function(){ var color = $(this).css('background-color'); if (color == '#81F79F') alert('#81F79F'); else alert('another color'); }); 。它将一些现有方法替换为非常古老的方法。我将在下一个版本中删除grid.addons.js。遗憾的是,在我发布了免费的jqGrid的新版本4.10.0后,我直接阅读了你的问题。如果我在删除已经在4.10.0中的文件之前阅读它。 : - )

同样,不建议使用grid.addons.jsgrid.postext.jsjquery.searchfilter.js文件。可能有趣的是grid.setcolumns.jsjquery.jqgrid.showhidecolumnmenu.jsjquery.createcontexmenufromnavigatorbuttons.js,但我建议您仅在使用文件中的相应方法时才包含文件。