Antd Popconfirm

Content Type: Widget
Categories: User Interface

Overview

A Mendix widget provide simple and compact confirmation dialog of an action, which based on Ant Design Component Popconfirm.

The difference with the confirm modal dialog is that it's more lightweight than the static popped full-screen confirm modal. 

You can access the online demo from here to show the features of this widget.

Features

  1. The Title, OK/Confirm button text and Cancel button text can be modified.
  2. The Title can render based on Mendix textTemplate pluggable widget feature.
  3. There are 12 placement options available.。
  4. Customizing of dialog CSS style with the Class Name parameter.
  5. To futher simplify the UX, only Confirm button but without Cancel button also available.
  6. Acting as a container to contain multi Mendix Widgets (need OnClick event).

 

Documentation

Demo urlhttps://demo-antdwidgets100.apps.ap-2a.mendixcloud.com/

 

Introduction

A Mendix widget provide simple and compact confirmation dialog of an action, which based on Ant Design Component Popconfirm. The difference with the confirm modal dialog is that it's more lightweight than the static popped full-screen confirm modal.

Features

  1. The Title, OK/Confirm button text and Cancel button text can be modified.
  2. The Title can render based on Mendix textTemplate pluggable widget feature.
  3. There are 12 placement options available.。
  4. Customizing of dialog CSS style with the Class Name parameter.
  5. To futher simplify the UX, only Confirm button but without Cancel button also available.
  6. Acting as a container to contain multi Mendix Widgets (need OnClick event).

Installation and Usage

Add this widget to the Mendix Project

  1. Download the mpk file from here.
  2. Copy the mpk file to your Mendix Project directory {YourMendixProjectFolder}/widgets/.
  3. Open your Mendix Project with Mendix Studio Pro and click on the menu Menu > App > Synchronize App Directory.

Set properties

  1. Add widget Antd PopConfirm to a Page.

  2. Add sub-widget in the PopConfirm container,can be Button, Antd Button, Badge, Text, Label and etc. The Title can use some dynamic text in Mendix (need to put PopConfirm in a Data container).

    popconfirm-help-1
  3. Config the parameters, including: Title, Placement, Confirm Text, Confirm Event, Cancel Text , Cancel Event.

    popconfirm-help-3
  4. Run the project locally and check.

Demo Project

  1. You can access the online demo from here to show the features of this widget.
  2. You can also download the demo project to run it on your own PC.

Datail of properties

General Section

  • Title:Pop dialog title.
  • Disabled:Disabled or not, default as No.
  • Placement:Dialog placement.
  • Class Name:CSS style.

Confirm Setting Section

  • Confirm Text:OK/Confirm button text.
  • On Confirm Event:OK/Confirm button event.

Cancel Setting Section

  • Show Cancel:Show Cancel button or not, default as Yes.
  • Cancel Text:Cancel button text.
  • On Cancel Event:Cancel button event.

 

Releases

Version: 1.0.0
Framework Version: 9.0.5
Release Notes: 1. The Title, OK/Confirm button text and Cancel button text can be modified. 2. The Title can render based on Mendix textTemplate pluggable widget feature. 3. There are 12 placement options available.。 4. Customizing of dialog CSS style with the Class Name parameter. 5. To futher simplify the UX, only Confirm button but without Cancel button also available. 6. Acting as a container to contain multi Mendix Widgets (need OnClick event).