CODEWITHSUNDEEP
jsfprimefaces
akhouri
akhouri

Reputation: 3165

How to disable the p:dialog 'X' close button

Referring to the example for PrimeFaces (Java / JSF) to create a modal dialog, https://www.primefaces.org/showcase/ui/overlay/dialog.xhtml

<p:dialog header="Header" widgetVar="dlg1" minHeight="40" width="350" showEffect="fade">
    <p class="m-0">Lorem ipsum dolor sit amet...</p>
</p:dialog>

This creates a modal dialog with a 'X' close button at the right corner. I want a solution to disable this close button for PrimeFaces dialog.

Upvotes: 7

Views: 38681

Answers (5)

VIPIN KUMAR
VIPIN KUMAR

Reputation: 53

You can use this way: [closable]="false" to your <p-dialog>, because PrimeNg is expecting it as a key of the object.

Upvotes: 2

Sineth Lakshitha
Sineth Lakshitha

Reputation: 713

Use

:closable="false"

as bellow

<Dialog :closable="false">

Upvotes: 0

&#214;mer Faruk Almalı
&#214;mer Faruk Almalı

Reputation: 3822

That way:

.ui-icon-closethick {
  display: none!important;
}

Just inspect that element and find the correct class to modify.

Upvotes: 0

Carlos UCR
Carlos UCR

Reputation: 359

.ui-dialog-titlebar-close span {
    display:none!important;
}

Upvotes: 1

miroslav_mijajlovic
miroslav_mijajlovic

Reputation: 1731

You can just add closable="false" to your p:dialog. Then you will not have the 'X' close Button.

Upvotes: 28

Related Questions