jqGrid warning dialog

Question

I have some custom toolbar buttons on a jqGrid. One of them is dependent on a row being selected, just like the built in edit and delete buttons. When the user clicks on it with no row selected, I want the user to be presented with the same warning dialog they are presented with from the built in Edit or Delete buttons. That is, I want to reuse the dialog that the grid uses that says:

Warning Please, select row

Any idea where the grid displays the alert from?

Thanks, Scott

Answer 1

I think that the code could looks like the following

var alertIDs = {themodal: 'alertmod', modalhead: 'alerthd', modalcontent: 'alertcnt'};

$.jgrid.viewModal("#" + alertIDs.themodal,
    {gbox: "#gbox_" + $.jgrid.jqID(this.p.id), jqm: true});
$("#jqg_alrt").focus();

where this.p.id (or $.jgrid.jqID(this.p.id)) can be replaced to the id of the grid. To be more sure that the alert work I do recommend you to use more long code

var alertIDs = {themodal:'alertmod',modalhead:'alerthd',modalcontent:'alertcnt'};
if ($("#"+alertIDs.themodal).html() === null) {
    $.jgrid.createModal(alertIDs,"<div>"+$.jgrid.nav.alerttext+
        "</div><span tabindex='0'><span tabindex='-1' id='jqg_alrt'></span></span>",
        {gbox:"#gbox_"+$.jgrid.jqID(this.p.id),jqModal:true,drag:true,resize:true,
        caption:$.jgrid.nav.alertcap,
        top:100,left:100,width:200,height: 'auto',closeOnEscape:true,
        zIndex: null},"","",true);
}
$.jgrid.viewModal("#"+alertIDs.themodal,
    {gbox:"#gbox_"+$.jgrid.jqID(this.p.id),jqm:true});
$("#jqg_alrt").focus();

The demo demonstrate the code. It displays the message

every time when you click on the "Click me!" button.

UPDATED: The answer contains the information how one can use the above dialog in free jqGrid. It describes many option. The simplest version contains only one simple call this.modalAlert();. It displays the same alert dialog, which free jqGrid displays internally.

Answer 2

I've just tried Oleg's below solution and it's not working for me.
Doing some debug I realised that $("#"+alertIDs.themodal).html() was 'undefined' for me, so the if case proposed by Oleg wasn't working properly.

I changed this:

if ($("#"+alertIDs.themodal).html() === null) {

into this:

if ($("#"+alertIDs.themodal).html() === null || $("#"+alertIDs.themodal).html() === undefined) {

and is working fine now.