Question-UI Component Layouts

Hello, 

I have a form layout which queries the data from a database on a button click, data is displayed in a grid field (with selection enabled) and upon selection (single or multiple rows) different section layouts are to be displayed. How do I wrap grid field, multiple section layouts inside a with()?

 

 

=load(
  local!dataSubset : a!dataSubset(
    startIndex: 1,
    batchSize: 1,
    data: {},
    totalCount: 0
  ),
  local!expDataSubset: a!dataSubset(
    startIndex: 1,
    batchSize: 1,
    data:{},
    totalCount: 0
  ),
  local!expdPagingInfo: a!pagingInfo(
    startIndex: 1,
    batchSize: 20
  ),
  local!pagingInfo:a!pagingInfo(
    startIndex: 1,
    batchSize: -1
  ), 
    local!rowData,
    local!selectedRows,
    local!singleLineFlag,
    local!selectedTierValue:"Tier 1",
    local!selectedReasonCode,
    local!selectedFeeReasonCode,
    local!expediteFee,
    local!carbonCopy,
  local!selectedYesNo:null,
  local!partialQuantity,
  local!initiatorComments,
  local!expediteData,
  local!apiErrorMessage,
  local!apiResult,
  local!orderNumber,
  local!gridDataSubset:null,
  local!gridSelection: a!gridSelection(
    pagingInfo: a!pagingInfo(
      startIndex: 1,
      batchSize: 20,
      sort:a!sortInfo(
        field:"line_id"
      )
    ),
    selected: {}
  ),

  a!formLayout(
  label: "Initiate Expedite",
  contents: {
    a!textField(
      label: "Order Number",
      labelPosition: "ADJACENT",
      /*instructions: "Please enter an Order Number to proceed!",*/
      value: ri!orders.order_number,
      saveInto: ri!orders.order_number,
      refreshAfter: "UNFOCUS",
      required: true,
      requiredmessage: "Value for Order Number is required"
      /*validations: a!validationMessage(*/
        /*message:"Please enter an Order Number to Proceed",*/
        /*validateAfter: "REFRESH",*/
        /*showWhen: isnull(ri!orders.order_number)*/
      /*)*/
    ),
    /*a!textField(*/
      /*label:"Check Value",*/
      /*value:local!dataSubset,*/
      /*readOnly:true()*/
    /*),*/
    a!buttonLayout(
      primaryButtons: {
        a!buttonWidget(
          label: "Search",
          saveInto: {
            /*a!save(local!dataSubset,rule!EXP_GetExpdOrderLinesByOrdNum(ri!orders.order_number,local!pagingInfo)),*/
            a!save(local!expDataSubset,rule!EXP_GetExpeditedLines(local!expdPagingInfo,ri!orders.order_number)),
            a!save(local!orderNumber,ri!orders.order_number)
          },
          style: "NORMAL",
          disabled: isnull(ri!orders.order_number)
        )
      },
      secondaryButtons: {}
    ),
    with(
     local!datasubset: if(isnull(local!orderNumber),{},rule!EXP_GetExpdOrderLinesByOrdNum(ri!orders.order_number,local!gridSelection.pagingInfo)),
     /*local!gridDataSubset:if(isnull(local!orderNumber),{},todatasubset(local!dataSubset.data,local!gridSelection.pagingInfo)),*/
       /*a!textField(*/
      /*label:"Check Value",*/
      /*value:local!gridDataSubset,*/
      /*readOnly:true()*/
    /*)*/
   a!sectionLayout(
     contents: {
         a!gridField(
      label: "Expedite Line Section",
        totalCount: if(local!datasubset.totalCount=0,1,local!datasubset.totalCount),
        emptyGridMessage: "Please enter a valid number order number to search for eligible lines ",
        columns: {
        a!gridTextColumn(
          label:"Line Number",
          field:"line_number",
          data:index(local!datasubset.data,"line_number","")
        ),
         a!gridTextColumn(
          label:"Order Number",
          field:"order_number",
          data:index(local!datasubset.data,"order_number","")
        ),
         a!gridTextColumn(
          label:"Account Name",
          field:"account_name",
          data:index(local!datasubset.data,"account_name","")
        ), a!gridTextColumn(
          label:"Part",
          field:"ordered_item",
          data:index(local!datasubset.data,"ordered_item","")
        ),
         a!gridTextColumn(
          label:"Description",
          field:"description",
          data:index(local!datasubset.data,"description","")
        ),
         a!gridTextColumn(
          label:"Quantity",
          field:"quantity",
          data:index(local!datasubset.data,"quantity","")
        ),
         a!gridTextColumn(
          label:"RequestDate",
          field:"request_date",
          data:index(local!datasubset.data,"request_date","")
        ),
         a!gridTextColumn(
          label:"ScheduleShipDate",
          field:"schedule_ship_date",
          data:index(local!datasubset.data,"schedule_ship_date","")
        ),
         a!gridTextColumn(
          label:"OrganizationCode",
          field:"organization_code",
          data:index(local!datasubset.data,"organization_code","")
        ),
         a!gridTextColumn(
          label:"SourceOrgCode",
          field:"source_org_code",
          data:index(local!datasubset.data,"source_org_code","")
        )
      },
        identifiers:index(local!datasubset.data, "line_id" ,  "{}"),
      value: local!gridSelection,
          saveInto: {
            local!gridSelection,
            a!save(
              local!rowData,
              index(local!datasubset.data,
              wherecontains(
      local!gridSelection.selected,
      local!datasubset.identifiers
    ),{})
            )
          },
       showWhen: if(index(local!datasubset,"totalCount","") >0,true(),false()),
       selection:if(index(local!datasubset,"totalCount","") >0,true,false)
    ),
      a!sectionLayout(
      label:"Expedite Single Line Request",
      contents: {
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
            a!textField(
            label: "Line Number",
              value: local!rowData.line_number,
              readOnly: true
            ),
            a!textField(
              label: "Order Number",
              value: local!rowData.order_number,
              readOnly: true
            ),
            a!textField(
             label: "Customer Name",
              value: local!rowData.account_name,
              readOnly: true
            ),
            a!textField(
             label: "Part Number",
              value: local!rowData.ordered_item,
              readOnly: true
            ),
            a!textField(
             label: "Description",
              value: local!rowData.description,
              readOnly: true
            ),
             a!textField(
             label: "Quantity",
              value: local!rowData.quantity,
              readOnly: true
            ),
             /*a!dropdownField(*/
              /*label:"Tier Value",*/
              /*placeholderLabel: "--- Select Tier Value ---",*/
              /*choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_TIERS"),"meaning",null),*/
              /*choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_TIERS"),*/
              /*value:local!selectedTierValue,*/
              /*saveInto: local!selectedTierValue,*/
              /*required: true()*/
            /*),*/
              a!dropdownField(
              label:"Reason Code",
              placeholderLabel: "--- Select a Reason Code ---",
              choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_REASONS"),"meaning",null),
              choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_REASONS"),
              value:local!selectedReasonCode,
              saveInto: local!selectedReasonCode,
              required: true()
            ),
            a!textField(
              label: "Expedite Fee",
              value: local!expediteFee,
              saveInto: local!expediteFee
            ),
               a!dropdownField(
              label:"Fee Reason",
              placeholderLabel: "--- Select a Reason Code ---",
              choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_FEE_REASONS"),"meaning",null),
              choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_FEE_REASONS"),
              value:local!selectedFeeReasonCode,
              saveInto: local!selectedFeeReasonCode
            )
          }
        ),
        a!columnLayout(
          contents: {
           
            a!textField(
              label: "Carbon Copy",
              value: local!carbonCopy,
              saveInto: local!carbonCopy
            ),
            a!textField(
              label: "Current Scheduled Date",
              value: local!rowData.schedule_ship_date,
              readOnly: true
            ),
            a!textField(
              label:"Request Date",
                value:local!rowData.request_date,
                readOnly: true()
            ),
          a!dropdownField(
             label: "Partials Accepted",
             labelPosition: "ABOVE",
             placeholderLabel: "--- Select a Value ---",
             choiceLabels: {
                   "Yes",
                   "No"
                          },
             choiceValues: {
                   "Y",
                   "N"
                          },
             value: local!selectedYesNo,
             saveInto: local!selectedYesNo
                      ),
          a!textField(
            label:"Partial Quantity",
            value:local!partialQuantity,
            saveInto: local!partialQuantity
          ),
          a!textField(
            label:"Initiator Comments",
            value:local!initiatorComments,
            saveInto: local!initiatorComments
          )
          }
        )
      }
    )
  },
  showWhen: if(or(isnull(local!rowData),or(length(local!gridSelection.selected)=0,length(local!gridSelection.selected)>1)),false,true)
    ),
        a!buttonLayout(
      primaryButtons: {
        a!buttonWidgetSubmit(
          label:"EXPEDITE",
          value:"SUBMIT",
          saveInto: {
            a!save(
              local!expediteData, a!toJson({
        "lineNumber":local!rowData.line_number,
        "orderHeaderId":local!rowData.header_id,
        "lineId":local!rowData.line_id,
        "orderType":"OE",
        "lineCount":count(local!rowData.header_id),
        "tier":index(local!selectedTierValue,"meaning",null),
        "reasonCode":index(local!selectedReasonCode,"meaning",null),
        "feeReasonCode":index(local!selectedFeeReasonCode,"meaning",null),
        "fee":local!expediteFee,
        "initiatorComments":local!initiatorComments,
        "partialQuantity":local!partialQuantity,
        "partialsAccepted":local!selectedYesNo,
        "carbonCopy":local!carbonCopy,
        "user":loggedInUser()
        
      })
            ),
            a!save(ri!orders.line_id,local!rowData.line_id),
            rule!EXP_BPM_Expereience_API(
              body: local!expediteData,
                 onSuccess: {
                   a!httpResponse_17r4(
                   statusCode: 200,
                   headers: {
                   a!httpHeader(name: "Content-Type", value: "application/json")
                            },
                  body: a!toJson_17r1(fv!result)
                   ) ,
                    a!save(ri!orders.line_id,local!rowData.line_id),
                    a!save(local!apiResult,fv!result),
                    a!save(ri!reqLineArray,index(a!fromJson(local!apiResult.body),"reqLineId",null))
                 }
            )
          },
          showWhen: if(isnull(local!rowData),false,true)
        )
       
      },
      secondaryButtons: {}
    ),
        a!sectionLayout(
      label:"Expedite Multiple Line Request",
      contents: {
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
             /*a!dropdownField(*/
              /*label:"Tier Value",*/
              /*placeholderLabel: "--- Select Tier Value ---",*/
              /*choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_TIERS"),"meaning",null),*/
              /*choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_TIERS"),*/
              /*value:local!selectedTierValue,*/
              /*saveInto: local!selectedTierValue,*/
              /*required: true()*/
            /*),*/
              a!dropdownField(
              label:"Reason Code",
              placeholderLabel: "--- Select a Reason Code ---",
              choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_REASONS"),"meaning",null),
              choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_REASONS"),
              value:local!selectedReasonCode,
              saveInto: local!selectedReasonCode,
              required: true()
            ),
            a!textField(
              label: "Expedite Fee",
              value: local!expediteFee,
              saveInto: local!expediteFee
            ),
               a!dropdownField(
              label:"Fee Reason",
              placeholderLabel: "--- Select a Reason Code ---",
              choiceLabels: index(rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_FEE_REASONS"),"meaning",null),
              choiceValues: rule!EXP_GetEBSLookupValuesbyCode("PANDUIT_EXPEDITE_FEE_REASONS"),
              value:local!selectedFeeReasonCode,
              saveInto: local!selectedFeeReasonCode
            ),
                     
            a!textField(
              label: "Carbon Copy",
              value: local!carbonCopy,
              saveInto: local!carbonCopy
            ),
          a!dropdownField(
             label: "Partials Accepted",
             labelPosition: "ABOVE",
             placeholderLabel: "--- Select a Value ---",
             choiceLabels: {
                   "Yes",
                   "No"
                          },
             choiceValues: {
                   "Y",
                   "N"
                          },
             value: local!selectedYesNo,
             saveInto: local!selectedYesNo
                      ),
          a!textField(
            label:"Partial Quantity",
            value:local!partialQuantity,
            saveInto: local!partialQuantity
          ),
          a!textField(
            label:"Initiator Comments",
            value:local!initiatorComments,
            saveInto: local!initiatorComments
          )
          }
        )
      }
    )
  },
  showWhen: if(or(isnull(local!rowData),or(length(local!gridSelection.selected)=0,length(local!gridSelection.selected)=1)),false,true)
    ),
        a!gridField(
      label: "Expedited Order Lines Info",
      instructions: "To Re-Submit or Cancel the expedited lines, please go to Records Tab and use Related Actions.",
      totalCount: index(local!expDataSubset, "totalCount", 0),
      columns: {
          a!gridTextColumn(
          label:"Line Number",
          field:"line_number",
          data:index(local!expDataSubset.data,"line_number","")
        ),
         a!gridTextColumn(
          label:"Order Number",
          field:"order_number",
          data:index(local!expDataSubset.data,"order_number","")
        ),
         a!gridTextColumn(
          label:"Source Type",
          field:"expedite_source_type",
          data:index(local!expDataSubset.data,"expedite_source_type","")
        ),
         a!gridTextColumn(
          label:"Item Number",
          field:"item_number",
          data:index(local!expDataSubset.data,"item_number","")
        ),
         a!gridTextColumn(
          label:"Item Description",
          field:"item_description",
          data:index(local!expDataSubset.data,"item_description","")
        ),
         a!gridTextColumn(
          label:"Customer Number",
          field:"customer_number",
          data:index(local!expDataSubset.data,"customer_number","")
        ),
         a!gridTextColumn(
          label:"Quantity",
          field:"quantity",
          data:index(local!expDataSubset.data,"quantity","")
        ),
         a!gridTextColumn(
          label:"Mfg Source Org Code",
          field:"mfg_source_org_code",
          data:index(local!expDataSubset.data,"mfg_source_org_code","")
        ),
         a!gridTextColumn(
          label:"Schedule Ship Date",
          field:"curr_scheduled_ship_date",
          data:index(local!expDataSubset.data,"curr_scheduled_ship_date","")
        ),
         a!gridTextColumn(
          label:"Mfg Org Code",
          field:"item_mfg_org_code",
          data:index(local!expDataSubset.data,"item_mfg_org_code","")
        ),
        a!gridTextColumn(
          label:"Ship From",
          field:"ship_from",
          data:index(local!expDataSubset.data,"ship_from","")
        ),
          a!gridTextColumn(
          label:"Status",
          field:"status",
          data:index(local!expDataSubset.data,"status","")
        )
      },
      value: local!expdPagingInfo,
      showWhen: if(index(local!expDataSubset,"totalCount",0)>0,true(),false())
    )
     }
   )
    
    )
  }
))

 

Thanks

  Discussion posts and replies are publicly visible

Parents
  • I think you can use a local variable for each section which controls the showWhen component of each those section and enable or disable them based on conditon. Move the with function on top of the form layout and also my suggestion is to split this form into different interfaces and plug them in so that you can test of the section independently, Will also help you with writing testing scripts as well.

    Sri
Reply
  • I think you can use a local variable for each section which controls the showWhen component of each those section and enable or disable them based on conditon. Move the with function on top of the form layout and also my suggestion is to split this form into different interfaces and plug them in so that you can test of the section independently, Will also help you with writing testing scripts as well.

    Sri
Children
No Data