Put the navSeparatorAdd bar before the default refresh button in jqgrid

I am using the jqgrid pager to just display an add and a refresh link for one of my grids. I tend to use the default icons for add, edit, delete, and refresh on most of my grids, which in turn, by jqgrid default, puts a | (bar) between the Add/Edit/Delete buttons and the refresh button.

On my "Games" grid, I'm using a custom Add button (which is displaying before the refresh), but there is no bar displaying before the refresh button. I've tried rearranging the order, adding a position option to navSeparatorAdd, and doing a lot of googling. However, I can't find anything that has helped me in this situation.

I haven't tried turning off Refresh and making a custom button, but that seems like a hack. Any ideas on how to get that bar after add & before refresh?

So, what I have: + @ |

What I want: + 开发者_运维技巧| @

(The @ is supposed to be the refresh icon)

Thanks, ember

       jQuery("#Games").jqGrid('navGrid',
            '#GamesPager',
            {edit:false, add:false, del:false, search:false, 
             refreshtitle: "Refresh"},
            {}, //settings for edit
            {}, // settings for add
            {},  // settings for delete
            {} // advanced searching settings
        );
        jQuery("#Games").jqGrid('navButtonAdd',
            "#GamesPager",
            {   caption:"Add Game", 
                buttonicon:"ui-icon-plus", 
                onClickButton:function(){ 
                 loadAddColorBox();
               }, 
                position: "first", 
                title:"Add Game", 
                cursor: "pointer"
            } 
        );
        jQuery("#Games").jqGrid('navSeparatorAdd',
            "#GamesPager",
            {sepclass : 'ui-separator',sepcontent: ''}
        );

---

Separator

It is possible to group some action adding separator. This can be done using the navSeparatorAdd method Syntax:

<script>
...
jQuery("#grid_id").navGrid("#pager",...).navButtonAdd("#pager",{parameters}).navSeparatorAdd("#pager",{separator_parameters}};
...
</script>

here's link of documentation
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_buttons

---

        $(table_selector).jqGrid('navGrid', pager_selector, {
            cloneToTop: true,
            edit: false,
            add: false,
            del: false,
            search: false,
            refresh: true,
            view: false
        });

        $(table_selector).jqGrid('navSeparatorAdd', table_selector + '_toppager', {
            sepclass: 'ui-separator',
            sepcontent: '',
            position: 'first'
        });

        $(table_selector).jqGrid('navButtonAdd', table_selector + '_toppager', {
            caption: 'save',
            buttonicon: 'ui-icon ace-icon fa fa-pencil blue',
            onClickButton: function() {
                alert("1");
            },
            position: 'first'
        });