jqGrid: Suchformular geändert, um flach zu sein?

Question

Dies ist ein Thema basierend auf "jqGrid - Change filter/search pop up form - to be flat on page - not a dialog". Ich habe das Suchformular basierend auf dem Thema flach gemacht, aber im Moment möchte ich nicht immer auf der Seite anzeigen, ich möchte es nur anzeigen, wenn der Benutzer Suche-Taste aus dem jqGrid drücken. Kann mir bitte jemand einen Hinweis oder eine Lösung geben? @Oleg kannst du mir bitte dabei helfen? Dank

Answer 1

Th Lösung könnte sehr nah an der alten sein. Sie können die folgenden Optionen des Suchdialog verwenden:

overlay: 0, 
drag: false, 
beforeShowSearch: function ($form) { 
    var $searchDialog = $form.closest(".ui-jqdialog"), 
     $gbox = $(this).closest(".ui-jqgrid"); 

    $searchDialog.insertBefore($gbox); 
    $searchDialog.css({ 
     position: "relative", 
     zIndex: "auto", 
     float: "left" 
    }) 
    $gbox.css({clear:"left"}); 
} 

Andere Optionen (wie closeOnEscape: true, closeAfterSearch: true, closeAfterReset: true, searchOnEnter: true, searchOperators: true und andere) gewählt, hängt von Ihren Vorlieben werden können.

The demo zeigt die Suche Dialog wie

Wenn Sie es vorziehen Bootstrap CSS anstelle von jQuery UI CSS verwenden, dann sollte man einige zusätzliche Zeilen hinzufügen:

overlay: 0, 
drag: false, 
beforeShowSearch: function ($form) { 
    var $searchDialog = $form.closest(".ui-jqdialog"), 
     $gbox = $(this).closest(".ui-jqgrid"); 

    $searchDialog.insertBefore($gbox); 
    $searchDialog.css({ 
     position: "relative", 
     zIndex: "auto", 
     padding: 0, 
     float: "left" 
    }); 
    $searchDialog.children(".modal-dialog").css({ 
     marginTop: 0, 
     marginBottom: 0 
    }); 
    $searchDialog.find(".modal-content").css({ 
     boxShadow: "none" 
    }); 
    $gbox.css({clear:"left"}); 
} 

the demo Sie, welche anzeigt :