diff --git a/components/doc/dropdown/templatedoc.js b/components/doc/dropdown/templatedoc.js
index 9aef248288..bd4528dd24 100644
--- a/components/doc/dropdown/templatedoc.js
+++ b/components/doc/dropdown/templatedoc.js
@@ -40,10 +40,24 @@ export function TemplateDoc(props) {
         );
     };
 
+    const panelFooterTemplate = () => {
+        return (
+            <div className="py-2 px-3">
+                {selectedCountry ? (
+                    <span>
+                        <b>{selectedCountry.name}</b> selected.
+                    </span>
+                ) : (
+                    'No country selected.'
+                )}
+            </div>
+        );
+    };
+
     const code = {
         basic: `
 <Dropdown value={selectedCountry} onChange={(e) => setSelectedCountry(e.value)} options={countries} optionLabel="name" placeholder="Select a Country" 
-    valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" />
+    valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" panelFooterTemplate={panelFooterTemplate} />
         `,
         javascript: `
 import React, { useState } from "react";
@@ -86,10 +100,24 @@ export default function TemplateDemo() {
         );
     };
 
+    const panelFooterTemplate = () => {
+        return (
+            <div className="py-2 px-3">
+                {selectedCountry ? (
+                    <span>
+                        <b>{selectedCountry.name}</b> selected.
+                    </span>
+                ) : (
+                    'No country selected.'
+                )}
+            </div>
+        );
+    };
+
     return (
         <div className="card flex justify-content-center">
             <Dropdown value={selectedCountry} onChange={(e) => setSelectedCountry(e.value)} options={countries} optionLabel="name" placeholder="Select a Country" 
-                valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" />
+                valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" panelFooterTemplate={panelFooterTemplate} />
         </div>    
     )
 }
@@ -140,10 +168,24 @@ export default function TemplateDemo() {
         );
     };
 
+    const panelFooterTemplate = () => {
+        return (
+            <div className="py-2 px-3">
+                {selectedCountry ? (
+                    <span>
+                        <b>{selectedCountry.name}</b> selected.
+                    </span>
+                ) : (
+                    'No country selected.'
+                )}
+            </div>
+        );
+    };
+
     return (
         <div className="card flex justify-content-center">
             <Dropdown value={selectedCountry} onChange={(e: DropdownChangeEvent) => setSelectedCountry(e.value)} options={countries} optionLabel="name" placeholder="Select a Country" 
-                valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" />
+                valueTemplate={selectedCountryTemplate} itemTemplate={countryOptionTemplate} className="w-full md:w-14rem" panelFooterTemplate={panelFooterTemplate} />
         </div>    
     )
 }
@@ -166,6 +208,7 @@ export default function TemplateDemo() {
                     placeholder="Select a Country"
                     valueTemplate={selectedCountryTemplate}
                     itemTemplate={countryOptionTemplate}
+                    panelFooterTemplate={panelFooterTemplate}
                     className="w-full md:w-14rem"
                 />
             </div>
diff --git a/components/lib/dropdown/DropdownBase.js b/components/lib/dropdown/DropdownBase.js
index 317c95b455..51c3ba50eb 100644
--- a/components/lib/dropdown/DropdownBase.js
+++ b/components/lib/dropdown/DropdownBase.js
@@ -7,6 +7,7 @@ export const DropdownBase = {
         ariaLabel: null,
         ariaLabelledBy: null,
         autoFocus: false,
+        children: undefined,
         className: null,
         clearIcon: null,
         dataKey: null,
@@ -16,9 +17,9 @@ export const DropdownBase = {
         emptyFilterMessage: null,
         emptyMessage: null,
         filter: false,
-        filterIcon: null,
         filterBy: null,
         filterClearIcon: null,
+        filterIcon: null,
         filterInputAutoFocus: true,
         filterLocale: undefined,
         filterMatchMode: 'contains',
@@ -47,6 +48,7 @@ export const DropdownBase = {
         optionValue: null,
         options: null,
         panelClassName: null,
+        panelFooterTemplate: null,
         panelStyle: null,
         placeholder: null,
         required: false,
@@ -62,8 +64,7 @@ export const DropdownBase = {
         transitionOptions: null,
         value: null,
         valueTemplate: null,
-        virtualScrollerOptions: null,
-        children: undefined
+        virtualScrollerOptions: null
     },
     getProps: (props) => ObjectUtils.getMergedProps(props, DropdownBase.defaultProps),
     getOtherProps: (props) => ObjectUtils.getDiffProps(props, DropdownBase.defaultProps)
diff --git a/components/lib/dropdown/DropdownPanel.js b/components/lib/dropdown/DropdownPanel.js
index ec04209027..94e167dfa4 100644
--- a/components/lib/dropdown/DropdownPanel.js
+++ b/components/lib/dropdown/DropdownPanel.js
@@ -43,6 +43,16 @@ export const DropdownPanel = React.memo(
             props.onFilterInputChange && props.onFilterInputChange(event);
         };
 
+        const createFooter = () => {
+            if (props.panelFooterTemplate) {
+                const content = ObjectUtils.getJSXElement(props.panelFooterTemplate, props, props.onOverlayHide);
+
+                return <div className="p-multiselect-footer">{content}</div>;
+            }
+
+            return null;
+        };
+
         const createGroupChildren = (optionGroup, style) => {
             const groupChildren = props.getOptionGroupChildren(optionGroup);
 
@@ -200,6 +210,7 @@ export const DropdownPanel = React.memo(
             });
             const filter = createFilter();
             const content = createContent();
+            const footer = createFooter();
 
             return (
                 <CSSTransition
@@ -218,6 +229,7 @@ export const DropdownPanel = React.memo(
                     <div ref={ref} className={className} style={props.panelStyle} onClick={props.onClick}>
                         {filter}
                         {content}
+                        {footer}
                     </div>
                 </CSSTransition>
             );
diff --git a/components/lib/dropdown/dropdown.d.ts b/components/lib/dropdown/dropdown.d.ts
index 85b2a0fbcb..2dde53d97a 100644
--- a/components/lib/dropdown/dropdown.d.ts
+++ b/components/lib/dropdown/dropdown.d.ts
@@ -218,6 +218,10 @@ export interface DropdownProps extends Omit<React.DetailedHTMLProps<React.InputH
      * Style class of the overlay panel element.
      */
     panelClassName?: string | undefined;
+    /**
+     * Template of the panel footer.
+     */
+    panelFooterTemplate?: React.ReactNode | ((props: DropdownProps, hide: () => void) => React.ReactNode);
     /**
      * Inline style of the overlay panel element.
      */