jQuery Grid Plugin - jqGridForum

Topic RSS

Related Topics sp_TopicIcon

How to remove "|" character between standard and custom navigator buttons

Tags: button navGrid delete pager icon

08/01/2011
05:22

edisonia

Princeton

Member

Members

Forum Posts: 6

Member Since:
08/01/2011

Offline

I am unable to figure out how to remove the "|" character that has been automatically placed between the standard buttons and my custom navigator buttons.

Any help would be appreciated. Code below.

Thanks,

====

jQuery("#sf_pageturns").navGrid('#pager',{edit:true,add:true,del:false,search:false,refresh:false})

.navButtonAdd('#pager',{caption:"", buttonicon: "ui-icon-trash", title: "Delete selected row", onClickButton: function(){

var rowcount = $('#sf_pageturns').jqGrid('getGridParam','reccount') ; // function to count rows

if(rowcount>1)

{

var gr = jQuery("#sf_pageturns").jqGrid('getGridParam','selrow');

if( gr != null ) jQuery("#sf_pageturns").jqGrid('delGridRow',gr,{reloadAfterSubmit:false});

else alert("You must select a row before pressing this button");

}

else

{

alert("You need to have at least one row, so this row may be edited but not deleted.");

}

})

09/01/2011
22:41

edisonia

Princeton

Member

Members

Forum Posts: 6

Member Since:
08/01/2011

Offline

As a workaround, I've added my own custom add and edit buttons, and set all of the default button visibilities to false. With that, the vertical separator has also disappeared.

Now I'm trying to figure out how to apply the jqmodal css to the alerts from my custom buttons, so my new alerts look like those provided with the standard buttons. Anyone know how to do this?

09/01/2011
22:58

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Hello edisonia,

removing separator from the navigator seems me very easy. Let us you have the pager with id="mypager". The separator will be added to the left part of the pager which has id="mypager_left" (the id of the pager + "_left"). The separator is the <td> element having <span class="ui-separator" /> as the child. All this you can see with Internet Explorer or Google Chrome Developer Tool or with respect of Firebug. So to remove the separator you can include the following line

$("#mypager_left td > span.ui-separator").parent().remove();

Best regards
Oleg

09/01/2011
23:20

edisonia

Princeton

Member

Members

Forum Posts: 6

Member Since:
08/01/2011

Offline

Thanks Oleg! I figured out that I need custom buttons for another reason, so my workaround solution is actually OK.

Now I'll focus on changing the alert box style...

Thanks,

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
46 Guest(s)

Currently Browsing this Page:
1 Guest(s)