0

jqueryuiRedmondテーマのjqgridが使用されます。

トップレベルのツールバーには、標準の追加、削除などのボタンと、次のように作成されたカスタムボタンが含まれています。

   $grid = $("#grid");
   $grid.jqGrid("navGrid", "#grid_toppager", { 
        search:  true,
        del: true,
        add: true,
        refresh: true, 
        edit: true } );
   $grid.jqGrid('navButtonAdd', '#grid_toppager', {
        caption: '',
        id: "grid_printbutton",
        title: 'Print order',
        buttonicon: 'ui-icon-print'
    });

html:

   <div id="grid1container" style="width: 100%; height: 100%">
        <table id="grid">
        </table>
    </div>

ボタンにはアイコンのみが含まれ、キャプションは含まれません。ページには、jquery ui button()関数を使用して作成された通常のボタンを備えたツールバーも含まれています。jqgridボタンの高さと幅は、jqueryuiボタン関数を使用して作成された通常のボタンよりも小さくなっています。ユーザーが通常の画面解像度でそれらをクリックすることは困難です。

jqgridのトップレベルのツールバーボタンのサイズを標準のjqueryuiボタンと同じにする方法は?ボタンの幅と高さを増やすことはできますか、それとも同じボタンで他のツールバーを作成して、対応するjqgridツールバーボタンアクションを強制的に呼び出すことはできますか?

4

1 に答える 1

0

この例では、CSSスタイルを使用するだけです。

#grid_printbutton { /*Styles to match other button themes */}

それはあなたのボタンをスタイリングします。ボタンの幅/高さに応じて、グリッドのCSSスタイルのデフォルトを掘り下げて、グリッド/ページャー領域にこの大きなボタンを表示するのに十分なスペースがあることを確認することもできます。

構築済みのボタンの場合、それらはによってスタイリングされています

<td id="search_GridName" class="ui-pg-button ui-corner-all" title="Find records">
   <div class="ui-pg-div">
      <span class="ui-icon ui-icon-search"></span>
   </div>
</td>

したがって、それらのスタイルを設定するには、特定のスタイルを適用できます。インラインボタンは、似たようなものを見つけることができます。ただし、より大きなインライン行ボタンに対応するために行サイズを大きくすると、グリッドに表示される情報の量は減少します。

于 2013-01-06T03:31:29.453 に答える