jqGrid filter-Symbolleiste anzeigen-Suche Betreiber Selektor nur für einzelne Spalte

Habe ich jqGrid Tabelle mit vielen Spalten. Die Suche im Netz gemacht wird, mit filter-Symbolleiste. Für die meisten von Ihnen suchen, ist halt einfach Standard-operator. Für eine datetime-Spalte möchte ich verschiedene Art von Operatoren und ein Datumsauswahl-Selektor.
Ich habe dataInit datepicker-Initialisierung searchoptions notwendig Operatoren searchoptions.sopt. Um dies zu zeigen Betreiber, die ich searchOperators zu wahren. Also für diese Spalte alles ok ist. Ich habe datepicker mit operator selector-popup. Aber für alle anderen Spalten Standard-operator-Symbol auf der linken Seite angezeigt. Es ist ärgerlich, wie-operator ist Standard-und Benutzer konnte es nicht ändern. So gibt es einige Möglichkeit, Sie zu verstecken mit jqGrid-API? Soweit ich sehen konnte, ich mich verstecken konnte diese nur mit meinem custom-code:

Ich zu meiner Spalte Modell und nach dem Rendern des grid (kann in loadComplete) für alle Spalten, die leer sopt oder sopt.length == 0 zu entfernen operator selector. Oder fügen Sie CSS-Klasse, die es verstecken. Nicht sicher, welche dieser Lösung ist besser (verstecken oder zu entfernen), da entfernen könnte, brach eine gewisse Logik, und verstecken könnte Auswirkungen auf die Berechnung der Breite. Hier ist Beispiel, was ich meine, auf fiddle

function fixSearchOperators()
{
    var columns = jQuery("#grid").jqGrid ('getGridParam', 'colModel');
    var gridContainer = $("#grid").parents(".ui-jqgrid");
    var filterToolbar = $("tr.ui-search-toolbar", gridContainer);

    filterToolbar.find("th").each(function()
    {
        var index = $(this).index();
        if(!(columns[index].searchoptions &&
             columns[index].searchoptions.sopt &&
             columns[index].searchoptions.sopt.length>1))
        {
            $(this).find(".ui-search-oper").hide();
        }
    });
}

Hat jemand bessere Ideen?

InformationsquelleAutor Yauhen.F | 2013-07-17

  1. 7

    Ich finde die Idee zu definieren, die Sichtbarkeit der Suche Operationen in jeder Spalte sehr gute Idee. +1 von mir.

    Ich würde nur empfehlen, Sie zu verändern ein wenig die Kriterien für die Auswahl, welche Spalten der Suche Symbolleiste, erhalten die Suchenden Operationen. Es scheint mir mehr heimisch sind einige neue Immobilie innerhalb von searchoptions. Damit können Sie so etwas schreiben

    searchoptions: {
    searchOperators: true,
    sopt: ["gt", "eq"],
    dataInit: function(elem) {
        $(elem).datepicker();
    }
}

    Ich denke, dass einige Säulen, wie die Säulen mit stype: "select", könnte noch zu haben sopt (zumindest sopt: ["eq"]), aber man will das nicht sehen Suche Betreiber für solche Spalten. Angabe der Sichtbarkeit, des Suchens Operationen auf die Spalte Ebene wäre sehr praktisch in solchen Fällen.

    Den geänderten fiddle-demo finden Sie hier. Ich habe in die demo-CSS von das Update (siehe die Antwort und der entsprechende bug-report). Der vollständige code ist unten

    var dataArr = [
    {id:1, name: 'steven', surname: "sanderson", startdate:'06/30/2013'},
    {id:2, name: "valery", surname: "vitko", startdate: '07/27/2013'},
    {id:3, name: "John", surname: "Smith", startdate: '12/30/2012'}];

function fixSearchOperators() {
    var $grid = $("#grid"),
        columns = $grid.jqGrid ('getGridParam', 'colModel'),
        filterToolbar = $($grid[0].grid.hDiv).find("tr.ui-search-toolbar");

    filterToolbar.find("th").each(function(index) {
        var $searchOper = $(this).find(".ui-search-oper");
        if (!(columns[index].searchoptions && columns[index].searchoptions.searchOperators)) {
            $searchOper.hide();
        }
    });
}

$("#grid").jqGrid({
    data: dataArr,
    datatype: "local",
    gridview: true,
    height: 'auto',
    hoverrows: false,
    colModel: [
        { name: 'id', width: 60, sorttype: "int"},
        { name: 'name', width: 70},
        { name: 'surname', width: 100},
        { name: 'startdate', sorttype: "date", width: 90,
            searchoptions: {
                searchOperators: true,
                sopt: ['gt', 'eq'],
                dataInit: function(elem) {
                    $(elem).datepicker();
                }
            },
            formatoptions: {
                srcformat:'m/d/Y',
                newformat:'m/d/Y'
            }
        }
    ]
});

$("#grid").jqGrid('filterToolbar', {
    searchOnEnter: false,
    ignoreCase: true,
    searchOperators: true
});
fixSearchOperators();

    Es zeigt das gleiche Ergebnis wie Jugend:

    jqGrid filter-Symbolleiste anzeigen-Suche Betreiber Selektor nur für einzelne Spalte

    InformationsquelleAutor Oleg

Schreibe einen Kommentar