0

I'm currently implementing a data table with a delete function in prime faces. Before deleting the user confirms his decision inside a dialog: if it's a "yes", then the "current" row (aka on which the user clicked the delete button) should be deleted. Currently the last row gets deleted irrespectable of on which row delete action has been triggered:

<p:dataTable var="var" value="#{bean.list}">

//some columns

//relevant column
 <p:column id="id">

  <p:commandButton id="deleteButton" onclick="PF('deleteDialog').show();" />
                            
  <p:confirmDialog id="deleteDialogId" widgetVar="deleteDialog" appendTo="@form">
    <p:commandButton id="confirm" onclick="PF('deleteDialog').hide();" 
      actionListener="#{bean.deleteRowAction(var)}" />
    <p:commandButton id="cancel" onclick="PF('deleteDialog').hide();" />
   </p:confirmDialog>
 </p:column>

</p:dataTable>

It seems like the actionListener of confirm button cannot access the current row by only getting var as an input. If I get rid of the dialog and trigger the action listener on deleteButton instead, everything works as expected:

// works, but no dialog
<p:dataTable var="var" value="#{bean.list}">

//some columns

//relevant column
 <p:column id="id">

  <p:commandButton id="deleteButton" actionListener="#{bean.deleteRowAction(var)}" />

 </p:column>

</p:dataTable>

I have found How can I pass selected row to commandLink inside dataTable or ui:repeat? as well as JSF Delete entity on DataTable with p:dialog but unfortunately it didn't help.

Is there a way to somehow pass "the current" table entry onto an external button?

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102

2 Answers2

2

There is an easier way to do this, by using the p:confirmDialog. This allows you to simply add p:confirm to your p:commandButton and you're done:

<h:form>     
    <p:dataTable var="var" value="#{bean.list}">
        <p:column id="id">
             <p:commandButton id="deleteButton"
                              action="#{bean.deleteRowAction(var)}">
                 <p:confirm header="Confirmation"
                            message="Are you sure?"
                            icon="pi pi-exclamation-triangle" />
            </p:commandButton>
        </p:column>
    </p:dataTable>
     
    <p:confirmDialog global="true">
        <p:commandButton value="Yes" type="button"
                         styleClass="ui-confirmdialog-yes" icon="pi pi-check" />
        <p:commandButton value="No" type="button"
                         styleClass="ui-confirmdialog-no" icon="pi pi-times" />
    </p:confirmDialog>      
</h:form>
Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
0

I just use confirm right inside the column:

<p:dataTable var="item" ...
    <p:column headerText="Item">
        <p:commandButton action="#{myBean.deleteItem(item)}">
            <p:confirm header="Confirmation" message="Delete item?" icon="ui-icon-alert"/>
        </p:commandButton>
    </p:column> 
Tom T
  • 263
  • 1
  • 2
  • 11
  • yeah, that worked for me as well. The reason I'm not using only `` is because I can't really fine tune the shown dialog. Otherwise I find it to be the best option – procrastinatingalex Aug 24 '20 at 15:27
  • You do have some ability to add your own text. For example: `` where the message can have HTML tags like '
    – Tom T Aug 24 '20 at 15:43
  • I'm aware of that. I need to also customize Yes and No buttons by adding little icons onto them. But thanks for pointing `header` and `message` out – procrastinatingalex Aug 24 '20 at 15:47
  • Last thing: if you really want a perfectly customized confirmation, just open up a dialog and let it do all the work. `action="#{myBean.whatever(item)}" update=":myConfirm" oncomplete="PF('myConfirm').show()"` – Tom T Aug 24 '20 at 15:53