How can make a mask before submit in a form?

[Deiva]

in a dialog, there is form.

Code:

<div id="dialog" class="easyui-dialog" closed="true" buttons="#dialog-btns"><form id="form1"> form html code ... </form></div>
<div id="dialog-btns">
        <a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="save()">Save</a>
</div>

I want to make a mask when click [save] button, just like refresh in datagrid, showing [processing, please wait...] with mask behind.
after submit finished, then remove the mask.

Could someone tell me how to do that?

[Deiva]

Here is mask sample. for reference...

[stworthy]

Please use the progress messager:

Code:

$.messager.progress();  // show the message box
$('#ff').form('submit',{
onSubmit:function(){
  var v=$(this).form('validate');
  if(!v) $.messager.progress('close');  // close the message box
  return v;
},
success:function(){
  $.messager.progress('close');  // close the message box
}
});

[karogel]

could id be just like refresh in datagrid, showing [processing, please wait...] and not using messenger approach