GridPanel commands loading mask

[Alaswad]

Dears,

I have the following GridPanel with row commands:

<ext:GridPanel 
	runat="server" 
	ID="VisitorsGV"
	ClientIDMode="Static"
	Title="SME Registered Visitors" 
	Frame="true"
	Height="500"
	width="600">
	<Store>
		<ext:Store runat="server">
			<Model>
				<ext:Model runat="server" >
					<Fields>
						<ext:ModelField Name="ID" />
						<ext:ModelField Name="ReferenceNumberID" />
						...
						..
						.                                  
					</Fields>
				</ext:Model>
			</Model>
		</ext:Store>
	</Store>
	<ColumnModel runat="server">
		<Columns>
			<ext:RowNumbererColumn Header="#" runat="server"  Align="Center" />            
			<ext:Column runat="server" Align="Center" Text="Ref. Number" DataIndex="ReferenceNumberID" />
			...
			..
			.    
			<ext:CommandColumn runat="server" Width="120">
			<Commands>
				<ext:GridCommand Icon="ArrowDown">
					<Menu EnableScrolling="false">
						<Items>
							<ext:MenuCommand Text="Send English Email" Icon="Email" CommandName="EnMail" />
							<ext:MenuCommand Text="Send Arabic Email" Icon="Email" CommandName="ArMail" />
						</Items>
					</Menu>

					<ToolTip Text="Re-sending Welcoming Email" />
				</ext:GridCommand>
				<ext:CommandSeparator />
				<ext:GridCommand Icon="Delete" CommandName="Delete">
					<ToolTip Text="Delete" />
				</ext:GridCommand>
				<ext:CommandSeparator />
				<ext:GridCommand Icon="NoteEdit" CommandName="Edit">
					<ToolTip Text="Edit" />
				</ext:GridCommand>
				<ext:CommandSeparator />
				<ext:GridCommand Icon="DiskDownload" CommandName="Download">
					<ToolTip Text="Download Attachment" />
				</ext:GridCommand>  
			</Commands>
				<PrepareToolbar Fn="prepareVisitorsGridToolbar" />
				<Listeners> 
					<Command  Handler="#{DirectMethods}.routeCommand(command, record.data.ID, { isUpload: true });" />
				</Listeners>
			</ext:CommandColumn>
		</Columns>
	</ColumnModel>
</ext:GridPanel>

Note that I remove un-needed definitions to simplify the code.

What I want to achieve is to show loading/sending message over the grid itself when the user choose send email command:

<ext:MenuCommand Text="Send English Email" Icon="Email" CommandName="EnMail" />

<EventMask ShowMask="true" Msg="Sending..." Target="CustomTarget" CustomTarget="={#{VisitorsGV}.body}" />

How to achieve this?

Regards,
Ali

[Alaswad]

Any updates?

[Alaswad]

Dears,

No updates?
Is it possible?

Why long time no answer.

Regards,
Ali Alaswad

[Vladimir]

Hi

You can set mask on DirectMethod attribute or set mask in config object and pass to direct method as last argument

Please see the following sample ()section 7
https://examples2.ext.net/#/Events/D...hods/Overview/

[Alaswad]

Thanks Vladimir,

<Command  Handler="#{DirectMethods}.routeCommand(command, record.data.ID,  { isUpload:  true , eventMask: { showMask: true, minDelay: 500, msg: 'Sending...'}});" />

Great..!

But the problem is: the loading is shown for all commands of the grid, I want to display mask only with "EnMail" and "ArMail".
How?

Regards,
Ali

[Daniil]

Please don't use the "eventMask" config for all the commands except those that you need a mask with.

[Alaswad]

Dear,

How to achieve that?

[Daniil]

I guess something like that:

if (command === "command1" || command === "command2") {
    App.direct.SomeDirectMethod(..., { eventMask: { ... }});
} else {
    App.direct.SomeDirectMethod(...);
}