Power Platform Community Forum Thread Details

In a PowerApps app, when using a form or the Patch function without a form, you might need to display a Date/Time column's hour in AM/PM format rather than the default 24-hour format.

After exploring several options and reading some excellent articles online, I finally came up with a simple solution.

For this solution, I am using modern controls.

In the PowerApps form, I am using a data card with a Date Picker control. For simplicity, I am naming the controls. Change the settings for each control as listed below.

Date Picker:

Name: dte_DatePicker

Minutes Drop-down:

Name: drp_Minutes

Hours Drop-down:

Name: drp_Hours

Items: (Below, I am including only the hours that I need. You may add all 24, starting at "00 AM")

["06 AM","07 AM","08 AM","09 AM","10 AM","11 AM","12 PM","1 PM","2 PM","3 PM","4 PM","5 PM","6 PM","7 PM","8 PM","9 PM","10 PM"]

DefaultSelectedItems:

// This expression checks if the 'Default' property of the parent control is not blank. If it is not blank, it converts the 'Default' value to a formatted time string in "hh:mm AM/PM" format for the "en-US" locale. Otherwise, it returns an empty array.

If(
    !IsBlank(Parent.Default),
    [
        Text(
            DateTimeValue(Parent.Default),
            "hh:mm AM/PM",
            "en-US"
        )
    ],
    []
)

OnChange:

// This expression updates the context variable `loc_AmPm` based on the selected value, converting specific AM/PM time strings into their corresponding 24-hour format representations.

UpdateContext(
    {
        loc_AmPm: Switch(
            Self.Selected.Value,
            "06 AM", "06",
            "07 AM", "07",
            "08 AM", "08",
            "09 AM", "09",
            "10 AM", "10",
            "11 AM", "11",
            "12 PM", "12",
            "1 PM", "13",
            "2 PM", "14",
            "3 PM", "15",
            "4 PM", "16",
            "5 PM", "17",
            "6 PM", "18",
            "7 PM", "19",
            "8 PM", "20",
            "9 PM", "21",
            "10 PM", "22"
        )
    }
)

Data Card:

Name: DateTimeDataCard

Update:

// This expression checks if the selected date from the 'dte_DatePicker' control is not blank. If it is not, it creates a new date-time value using the year, month, and day from the selected date, along with the hour value converted from 'loc_AmPm', the minute value from 'drp_Minutes', and the second value from the selected date.

If(
    Not IsBlank(dte_DatePicker.SelectedDate),
    DateTime(
        Year(dte_DatePicker.SelectedDate),
        Month(dte_DatePicker.SelectedDate),
        Day(dte_DatePicker.SelectedDate),
        Value(loc_AmPm),
        Value(drp_Minutes.Selected.Value),
        Second(dte_DatePicker.SelectedDate)
    )
)

Categories:

General Discussion