MIPanel enhancements for the Mashup Designer

Smart Office Hot Fix 12 was just released (10.2.0.88). We have some new features and in this post I’ll cover a changes to the MIPanel that will make it easier to chain calls together. The new features for the MIPanel are:

  • New events: CompletedSuccessfully and CompletedWithError
  • New properties: ShowMessagesInDialog and ShowMessagesInStatusBar
  • New result property that you can bind to: MIPanel.ErrorInfo. This property will contain error information from the first failed transaction. It has ErrorMessage, ErrorCode, ErrorField, Transaction and Program.

Properties

For those of you who have use conditions on events you can now consider using the new events. An example scenario would be updating item information and if that transaction is successful you would like to run another transaction. In that case you can trigger the second update based on CompletedSuccessfully instead of UpdateCompleted.

Item update

Please note that I have some hard coded values in the example. I did have to configure MandatoryInputFields since I’m not changing the item number as the behavior of the MIPanel is to only send updated data to an MITransaction. The use of the event is pretty straight forward. For numeric input I used the NumericTextBox. You will not find it in the Designer UI but it is part of Smart Office so you can use it if you edit the XAML. Here is the XAML:

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ui="clr-namespace:Mango.UI.Controls;assembly=Mango.UI" xmlns:mashup="clr-namespace:Mango.UI.Services.Mashup;assembly=Mango.UI" xmlns:m3="clr-namespace:MForms.Mashup;assembly=MForms">
	<Grid.ColumnDefinitions>
		<ColumnDefinition Width="1*" />
	</Grid.ColumnDefinitions>
	<Grid.RowDefinitions>
		<RowDefinition Height="Auto" />
		<RowDefinition Height="1*" />
		<RowDefinition Height="Auto" />
		<RowDefinition Height="Auto" />
	</Grid.RowDefinitions>
	<m3:MIPanel Name="ItemDetail" Grid.Row="0" Margin="0,15,0,0">
		<m3:MIPanel.Events>
			<mashup:Events>
				<mashup:Event SourceEventName="Startup" TargetEventName="Get">
					<mashup:Parameter TargetKey="ITNO" Value="AC-001" />
					<mashup:Parameter TargetKey="FACI" Value="010" />
				</mashup:Event>
			</mashup:Events>
		</m3:MIPanel.Events>
		<Grid>
			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="Auto" />
				<ColumnDefinition Width="10" />
				<ColumnDefinition Width="200" />
				<ColumnDefinition Width="15" />
				<ColumnDefinition Width="*" />
			</Grid.ColumnDefinitions>
			<Grid.RowDefinitions>
				<RowDefinition Height="Auto" />
				<RowDefinition Height="5" />
				<RowDefinition Height="Auto" />
				<RowDefinition Height="5" />
				<RowDefinition Height="Auto" />
				<RowDefinition Height="5" />
				<RowDefinition Height="Auto" />
				<RowDefinition Height="10" />
				<RowDefinition Height="Auto" />
			</Grid.RowDefinitions>
			<Label Content="Item number:" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" />
			<TextBox MaxLength="15" Text="{Binding [ITNO]}" IsEnabled="false" Grid.Row="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
			<Label Content="Name:" Grid.Row="2" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" />
			<TextBox MaxLength="30" Text="{Binding [ITDS]}" Grid.Row="2" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
			<Label Content="Description 2:" Grid.Row="4" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" />
			<TextBox MaxLength="60" Text="{Binding [FUDS]}" Grid.Row="4" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
			<Label Content="Avergage cost:" Grid.Row="6" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" />
			<ui:NumericTextBox MaxLength="10" Name="inputAPPR" Text="{Binding [APPR]}" Grid.Row="6" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
			<Button Name="SaveButton" Content="Update" Grid.Row="8" Grid.Column="2" HorizontalAlignment="Right">
				<Button.CommandParameter>
					<mashup:Events>
						<mashup:Event TargetName="ItemDetail" SourceEventName="Click" TargetEventName="Update" Debug="True">
							<mashup:Parameter TargetKey="ITNO" Value="{Binding [ITNO]}" />
							<mashup:Parameter TargetKey="FUDS" Value="{Binding [FUDS]}" />
							<mashup:Parameter TargetKey="ITDS" Value="{Binding [ITDS]}" />
						</mashup:Event>
					</mashup:Events>
				</Button.CommandParameter>
			</Button>
		</Grid>
		<m3:MIPanel.DataSources>
			<m3:MIDataSourceList>
				<m3:MIDataSource Program="MMS200MI" Transaction="Get" Type="Get" InputFields="ITNO" OutputFields="ITNO,ITDS,FUDS" />
				<m3:MIDataSource Program="MMS200MI" Transaction="GetItmFac" Type="Get" InputFields="FACI,ITNO" OutputFields="APPR" />
				<m3:MIDataSource Program="MMS200MI" Transaction="UpdItmBasic" Type="Update" InputFields="ITNO,ITDS,FUDS" MandatoryInputFields="ITNO" />
			</m3:MIDataSourceList>
		</m3:MIPanel.DataSources>
	</m3:MIPanel>
	<m3:MIPanel Name="SecondUpdatePanel">
		<m3:MIPanel.Events>
			<mashup:Events>
				<mashup:Event SourceName="ItemDetail" SourceEventName="CompletedSuccessfully" TargetEventName="Update" Debug="True">
					<mashup:Event.Conditions>
						<mashup:Conditions>
							<mashup:Condition SourceValue="{Binding ElementName=inputAPPR, Path=Text}" TargetValue="{Binding ElementName=ItemDetail, Path=[MMS200MI.GetItemFac.APPR]}" Operator="NotEqual" />
						</mashup:Conditions>
					</mashup:Event.Conditions>
					<mashup:Parameter SourceKey="ITNO" />
					<mashup:Parameter TargetKey="FACI" Value="010" />
					<mashup:Parameter SourceKey="APPR" />
				</mashup:Event>
			</mashup:Events>
		</m3:MIPanel.Events>
		<m3:MIPanel.DataSource>
			<m3:MIDataSource Program="MMS200MI" Transaction="UpdItmFac" Type="Update" InputFields="FACI,ITNO,APPR" />
		</m3:MIPanel.DataSource>
	</m3:MIPanel>

	<ui:StatusBar Name="StatusBar" Grid.Row="3" Grid.Column="0" />
</Grid>

Unfortunately the Documentation in the Mashup Designer is not updated with the new properties etc as there has been no update to the Mashup Designer. You can always find the latest API documentation in the Smart Office SDK.

Please note that these events applies to update transactions. You set the type of the transaction on the MIDataSource. We will automatically try and determine the type based on the transaction name.

For a full listing of changes made on this release, refer to Lawson KB 1626878 / M3 KB 1623430.

8 thoughts on “MIPanel enhancements for the Mashup Designer

  1. Edz

    Hi Karin,

    Thanks for posting this new functionality about the MI Panel.
    We already installed the latest version of the Mashup designer.
    I have a question regarding this, I created an example using a Get functionality but I can’t make it to show the pop-up message, it only shows the message in the status bar.

    Hope you can help me.

    Thank you in advance!

    Below is the code for the example XAML.

    Reply
      1. Edz

        Okay, thanks Karin.

        <Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ui="clr-namespace:Mango.UI.Controls;assembly=Mango.UI" xmlns:mashup="clr-namespace:Mango.UI.Services.Mashup;assembly=Mango.UI" xmlns:m3="clr-namespace:MForms.Mashup;assembly=MForms">
        	<Grid.Resources></Grid.Resources>
        	<Grid.ColumnDefinitions>
        		<ColumnDefinition Width="*" />
        	</Grid.ColumnDefinitions>
        	<Grid.RowDefinitions>
        		<RowDefinition Height="*" />
        		<RowDefinition Height="Auto" />
        	</Grid.RowDefinitions>
        	<Grid Name="gr1">
        		<Grid.RowDefinitions>
        			<RowDefinition Height="1*" />
        			<RowDefinition Height="Auto" />
        			<RowDefinition Height="Auto" />
        		</Grid.RowDefinitions>
        		<Grid.ColumnDefinitions>
        			<ColumnDefinition Width="50" />
        			<ColumnDefinition Width="100" />
        			<ColumnDefinition Width="Auto" />
        		</Grid.ColumnDefinitions>
        		<Label Name="lbl_faci" Content="Facility: " Grid.Row="0" Grid.Column="0" />
        		<TextBox Name="txb_FACI" Height="3" Width="50" Grid.Row="0" Grid.Column="1" />
        		<Button Name="btn_getFaci" IsDefault="True" Style="{DynamicResource styleButtonPrimaryMashup}" Grid.Row="0" Grid.Column="2" Content="Search">
        			<Button.CommandParameter>
        				<mashup:Events>
        					<mashup:Event TargetName="MIP_GetFacility" SourceEventName="Click" TargetEventName="Get">
        						<mashup:Parameter TargetKey="CONO" Value="{mashup:UserContextValue Path=M3/CurrentCompany}" />
        						<mashup:Parameter TargetKey="FACI" Value="{Binding ElementName=txb_FACI, Path=Text}" />
        					</mashup:Event>
        				</mashup:Events>
        			</Button.CommandParameter>
        		</Button>
        		
        		<m3:MIPanel Name="MIP_GetFacility" Grid.Row="1" Grid.Column="0">
        			<m3:MIPanel.Events>
        				<mashup:Events>
        					<mashup:Event TargetName="MIP_GetFacility" SourceEventName="Startup" TargetEventName="Get" Debug="True">
        						<mashup:Parameter TargetKey="CONO" Value="{mashup:UserContextValue Path=M3/CurrentCompany}" />
        						<mashup:Parameter TargetKey="FACI" Value="{Binding ElementName=txb_FACI, Path=Text}" />
        					</mashup:Event>
        				</mashup:Events>
        			</m3:MIPanel.Events>
        			<m3:MIPanel.DataSource>
        				<m3:MIDataSource Program="CRS008MI" Transaction="Get" Type="Get" InputFields="CONO,FACI" OutputFields="FACN" />
        			</m3:MIPanel.DataSource>
        		</m3:MIPanel>
        		
        		
        		<m3:MIPanel Name="MIP_GetFacility2" Grid.Row="2" Grid.Column="0">
        			<m3:MIPanel.Events>
        				<mashup:Events>
        					<mashup:Event SourceName="MIP_GetFacility" SourceEventName="CompletedSuccessfully" TargetEventName="Get" />
        					<mashup:Event SourceName="MIP_GetFacility" SourceEventName="CompletedWithErrors" TargetEventName="Get" />
        				</mashup:Events>
        			</m3:MIPanel.Events>
        			<m3:MIPanel.DataSource>
        				<m3:MIDataSource Program="CRS008MI" Transaction="Get" Type="Get" InputFields="CONO,FACI" />
        			</m3:MIPanel.DataSource>
        		</m3:MIPanel>
        	</Grid>
        	
        	<ui:StatusBar Name="StatusBar" Grid.Row="1" />
        </Grid>
        
    1. karinpb Post author

      Hi Edz, Sorry for the late reply. The error dialog will not show automatically for get and list transactions. A new property on the MIPanel called ShowListAndGetMessagesInDialog has been added. It will force the dialog. Even though ShowMessagesInDialog should have been enough we can’t change the default behavior not to show dialogs for get requests as it would affect existing Mashups. Any addition or change to Mashup controls has to be done with care so even if I would like to have less and clearly defined properties it is not possible due to the risk for Mashup developers. This new property should make it to HF19 of Smart Office.

      Reply
  2. Priyantha

    hi

    I wrote a Mashup for update Item Master data . it gives below error when I press save button . But your example is working fine . Please help….

    Error Message is : Transaction UpdItemBasic in program requires a value for field ITNO

    I feel Textbox value of ITNO is not set to API ITNO field .

    <!–

    –>

    Reply
  3. Priyantha

    Edit by Karin: Not sure what you did but tabs will mess up the code and everything was URLEncoded so I added the source tag and fixed the format.

    <Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ui="clr-namespace:Mango.UI.Controls;assembly=Mango.UI" xmlns:mashup="clr-namespace:Mango.UI.Services.Mashup;assembly=Mango.UI" xmlns:m3="clr-namespace:MForms.Mashup;assembly=MForms">
      <Grid.Resources></Grid.Resources>
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition Height="1*" />
        <RowDefinition Height="1*" />
      </Grid.RowDefinitions>
      <m3:ListPanel Grid.Row="0" Grid.Column="0" Name="ItemMaster">
        <m3:ListPanel.Events>
          <mashup:Events>
            <mashup:Event SourceEventName="Startup">
              <mashup:Parameter TargetKey="MMCONO" />
              <mashup:Parameter TargetKey="MMITNO" />
            </mashup:Event>
          </mashup:Events>
        </m3:ListPanel.Events>
        <m3:ListPanel.Bookmark>
          <m3:Bookmark Program="MMS001" Table="MITMAS" KeyNames="MMCONO,MMITNO" IncludeStartPanel="True" SortingOrder="1" View="A01-01" />
        </m3:ListPanel.Bookmark>
      </m3:ListPanel>
      
      <m3:MIPanel Grid.Row="1" Grid.Column="0" Name="ItemDetails">
        <m3:MIPanel.Events>
          <mashup:Events>
            <mashup:Event SourceName="ItemMaster" TargetName="ItemDetails" SourceEventName="CurrentItemChanged" TargetEventName="Get" Debug="True">
            <mashup:Parameter SourceKey="MMITNO" TargetKey="ITNO" />
            </mashup:Event>
          </mashup:Events>
        </m3:MIPanel.Events>
        <m3:MIPanel.DataSources>
          <m3:MIDataSourceList>
            <m3:MIDataSource Program="MMS200MI" Transaction="GetItmBasic" Type="Get" InputFields="ITNO" OutputFields="ITNO,ITDS,FUDS" />
            <m3:MIDataSource Program="MMS200MI" Transaction="UpdItmBasic" Type="Update" InputFields="ITNO,ITDS,FUDS" />
          </m3:MIDataSourceList>
        </m3:MIPanel.DataSources>
        <Grid>
          <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="10" />
            <ColumnDefinition Width="200" />
            <ColumnDefinition Width="15" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="10" />
            <ColumnDefinition Width="200" />
            <ColumnDefinition Width="15" />
            <ColumnDefinition Width="*" />
          </Grid.ColumnDefinitions>
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="5" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
          </Grid.RowDefinitions>
          <Label Content="Item number:" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" />
          <TextBox MaxLength="15" Text="{Binding [ITNO]}" Grid.Row="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" Name="IITNO" />
          <Label Content="Name:" Grid.Row="2" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" Name="ITDS" />
          <TextBox MaxLength="30" Text="{Binding [ITDS]}" Grid.Row="2" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
          <Label Content="Description 2:" Grid.Row="0" Grid.Column="4" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="0" Padding="0" Name="FUDS" />
          <TextBox MaxLength="60" Text="{Binding [FUDS]}" Grid.Row="0" Grid.Column="6" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
          <StackPanel Grid.Row="4" Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,15,0,0" Grid.ColumnSpan="7">
            <Button Content="{mashup:Constant Key=Save,File=Mango.UI}" Width="150" VerticalAlignment="Center">
              <Button.CommandParameter>
                <mashup:Events>
                  <mashup:Event TargetEventName="Update" TargetName="ItemDetails" SourceEventName="Click" Debug="True">
                    <!–<mashup:Parameter TargetKey="ITNO" Value="{Binding ElementName=IITNO,Path=Text}" />
                    <mashup:Parameter TargetKey="ITDS" Value="{Binding ElementName=ITDS,Path=Text}" />
                    <mashup:Parameter TargetKey="FUDS" Value="{Binding ElementName=FUDS,Path=Text}" />–>
                  </mashup:Event>
                </mashup:Events>
              </Button.CommandParameter>
            </Button>
          </StackPanel>
        </Grid>
      </m3:MIPanel>
    </Grid>
    
    Reply
    1. karinpb Post author

      Hi,
      When defining your update data source you must specify the fields that are mandatory. If not they will not be sent to BE. We have been asked only to send those fields in the update transaction that has been *changed* and since we have the data before any changes we see that ITNO isn’t changed so we don’t included it.

      Don’t forget to set IsEnabled=false on the ITNO field as well.

       
      	<m3:MIPanel.DataSources>
      			<m3:MIDataSourceList>
      				<m3:MIDataSource Program="MMS200MI" Transaction="GetItmBasic" Type="Get" InputFields="ITNO" OutputFields="ITNO,ITDS,FUDS" />
      				<m3:MIDataSource Program="MMS200MI" Transaction="UpdItmBasic" Type="Update" InputFields="ITNO,ITDS,FUDS" MandatoryInputFields="ITNO" />
      			</m3:MIDataSourceList>
      		</m3:MIPanel.DataSources>
      
      Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s