Show Loading... message when user clicks custom button

Try adding

to the client before of the button code. By default it is already there.

to the client before of the button code. By default it is already there.

Yes, I see what you mean; however, this places a message below the button.
What I want is something more like the "Loading..." message used by ASPRunner itself, where the datagrid "blocks" with a darkened overlay until refreshed.
A central, popup style message would also do, so long as the user doesn't have to click Ok to dismiss, etc.

Maybe something like this can be implemented:

https://www.codeproject.com/Articles/424745/MVC-Razor-In-Progress-Icon

here's how I do it
First I put a spinner into the HTML ( design mode ) in Visual Editor on the page that has the custom button

I normally put this just before the ($footer} way at the bottom ...
i.e. <DIV class="loading" id="mark">

<IMG id="spinner" src="images/Loadingspinner.gif" border="0">

</DIV>
you can find web sites that you can generate your own spinner...
and here's the custom CSS you put in your custom CSS in the style

this puts the spinner dead center of the web page... etc...
.loading{

width:75px;

height:75px;

position:fixed;

top:50%;

left:50%;

margin-top:-150px;

margin-left:-150px;

}
Now say you wish to have the a button that you wish to have the loading spinner appear when pressed....
not to interfere with the aSP runner gen'd ID's for a button
I put the ubiquitous <span id="somebuttonid"> around the <button>.... </button> html </span> with my own ID
then in the ONLOAD Javascript event for the page I use the JQIUERY event trigger to show / hide the spinner
jQuery comes with asp runner... so below works out of the box... no problems...
$("#spinner").hide(); // this hides the spinner when page is first loaded....
$( "#somebuttonid" ).mouseup(function() { // I use mouseup so as to not interfere with the mouse click action of the button

// alert( "Handler for mouseup called." );

$("#spinner").show(); // and here show the button

});
works great!!
hope it helps...

Thanks for sharing. I will definitely try this out.

Thanks!!!
What I did was this:
In List form:
<DIV title="SAEM" id="wsdialog" style="display: none;">

<TABLE style="margin-top: 8px;">

<TBODY>

<TR>

<TD style="vertical-align: top;" rowspan="2">

<DIV id="wsdialogimg">

<IMG src="">

</DIV>

</TD>

<TD style="padding: 0px 0px 10px 10px;">

<DIV id="wsdialogtxt1">

</DIV>

</TD>

</TR>

<TR>

<TD style="padding: 3px 0px 3px 10px;">

<DIV id="wsdialogtxt2">

</DIV>

</TD>

</TR>

</TBODY>

</TABLE>

</DIV>
In button:
Client Before:

var id = "Act__Saldo";

var button = $("[id^=" + id + "]");

Runner.addDisabledClass(button);

$("#wsdialog").dialog({

autoOpen: false,

modal: true

});

$("#wsdialog").dialog("option", "width", 240);

$("#wsdialog").dialog("option", "height", 120);

$("#wsdialog").dialog("option", "resizable", false);

$("#wsdialog").css("background-color", "palegreen");

$("#wsdialogimg").children('img').attr('src','/images/hourglass-go-icon.png');

$("#wsdialogtxt1").text("Consultando web service.");

$("#wsdialogtxt2").text("Por favor espere...");

$("#wsdialog").dialog("open");
Server:

string sql = "DECLARE @returnstatus int EXEC @returnstatus = usp_ActualizaSaldo '" + keys["contractId"].ToString() + "' select @returnstatus";

XVar returnstatus = tDAL.DBLookup(sql);

result["exitcode"] = returnstatus.ToString();
Client After:

if (result["exitcode"] !=0) {

$('#wsdialog').dialog('close');
$("#wsdialog").dialog({

autoOpen: false,

modal: true,

'buttons': {

'Aceptar': function(){

// here is the modification of the button

// opacity set to 25%, all events unbound

location.reload();

}

}

});

$("#wsdialog").dialog("option", "width", 275);

$("#wsdialog").dialog("option", "height", 175);

$("#wsdialog").dialog("option", "resizable", false);

$("#wsdialog").css("background-color", "orange");

$("#wsdialogimg").children('img').attr('src','/images/alert-icon.png');

$("#wsdialogtxt1").text("Error al consultar el webservice.");

$("#wsdialogtxt2").text("Favor de reintentar más tarde.");

$("#wsdialog").dialog("open");

}

else {

location.reload();

};
This seems to work nicely.