Primefaces 当我使用onClick事件时，不起作用

希望你们都会好起来。场景是我有一个页面，你可以在上面上传图片，然后删除它。我使用了这样的代码

..... 问题是如果我使用

onclick=""

但是当我使用

onclick="if (! confirm('Are you sure, you want to delete the picture?') ) { return false;}; return true; "

然后，删除不起作用。为什么？请告诉我我做错了什么

---

我使用的是PrimeFaces 2.2，这看起来很奇怪，因为您正在用Java的方式尝试这种方法，但是您使onclick=if复杂化了！确认“确实要删除图片吗？”{return false；}；返回true；-您没有正确使用javascript确认函数。 你可以写：

onclick="return confirm('Are you sure, you want to delete the picture?')"

，但由于您使用的是PrimeFacesb，因此可以升级到3.0.M4，也可以使用confirmDialog组件：

<p:commandButton value="Delete picture" onclick="confirmation.show()" type="button"/>
<p:confirmDialog message="Are you sure, you want to delete the picture?"  
            showEffect="bounce" hideEffect="explode"  
            header="Initiating deleting process" severity="alert" widgetVar="confirmation">  

    <p:commandButton value="Yes Sure" update="<some component you want to update>" oncomplete="confirmation.hide()"  actionListener="#{myBean.deleteMethod}" />  
    <p:commandButton value="Not Yet" onclick="confirmation.hide()" type="button" />   

</p:confirmDialog>

---

它确实更容易写，但肯定更优雅、更漂亮

这看起来很奇怪，因为您正在以Java的方式尝试这种方法，但是您正在使onclick=if变得复杂！确认“确实要删除图片吗？”{return false；}；返回true；-您没有正确使用javascript确认函数。 你可以写：

onclick="return confirm('Are you sure, you want to delete the picture?')"

，但由于您使用的是PrimeFacesb，因此可以升级到3.0.M4，也可以使用confirmDialog组件：

<p:commandButton value="Delete picture" onclick="confirmation.show()" type="button"/>
<p:confirmDialog message="Are you sure, you want to delete the picture?"  
            showEffect="bounce" hideEffect="explode"  
            header="Initiating deleting process" severity="alert" widgetVar="confirmation">  

    <p:commandButton value="Yes Sure" update="<some component you want to update>" oncomplete="confirmation.hide()"  actionListener="#{myBean.deleteMethod}" />  
    <p:commandButton value="Not Yet" onclick="confirmation.hide()" type="button" />   

</p:confirmDialog>

---

它确实更容易写，但肯定更优雅、更漂亮

返回true和false不需要在那里显示 只需使用简单的代码，如下所示

onclick="return confirm('Are you sure, you want to delete the picture?')"

---

返回true和false不需要在那里 只需使用简单的代码，如下所示

onclick="return confirm('Are you sure, you want to delete the picture?')"

---

我没有使用p:commandLink。虽然我是这样做的，而且效果很好

<h:outputText value="*" />
<h:outputText value="Map: " />
<p:fileUpload id="cityMap"
              description="Image"
              update="city messages"
              allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
              auto="true"
              fileUploadListener="#{cityDetail.imageUpload}" >

</p:fileUpload>

<p:graphicImage id="city"
                value="#{cityDetail.imagePath}"
                width="80"
                height="50"
                cache="false">

    <f:event type="preRenderComponent" listener="#{cityDetail.putImage}" />

</p:graphicImage>

<h:commandLink value="remove"
               title="Remove Picture"
               style="color: #0d5b7f;text-decoration: underline"
               onclick="if (! confirm('Are you sure, you want to remove picture?') ) { return false;}; return true; ">

     <f:ajax event="click"
             render="city"
             listener="#{cityDetail.removeImage}"/>

 </h:commandLink>

---

谢谢

我没有使用p:commandLink。虽然我是这样做的，而且效果很好

<h:outputText value="*" />
<h:outputText value="Map: " />
<p:fileUpload id="cityMap"
              description="Image"
              update="city messages"
              allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
              auto="true"
              fileUploadListener="#{cityDetail.imageUpload}" >

</p:fileUpload>

<p:graphicImage id="city"
                value="#{cityDetail.imagePath}"
                width="80"
                height="50"
                cache="false">

    <f:event type="preRenderComponent" listener="#{cityDetail.putImage}" />

</p:graphicImage>

<h:commandLink value="remove"
               title="Remove Picture"
               style="color: #0d5b7f;text-decoration: underline"
               onclick="if (! confirm('Are you sure, you want to remove picture?') ) { return false;}; return true; ">

     <f:ajax event="click"
             render="city"
             listener="#{cityDetail.removeImage}"/>

 </h:commandLink>

---

谢谢

如果您在该标记中使用p:commandLink，您将发现ajax；设置ajax=false，那么它就可以正常工作。

如果在该标记中使用p:commandLink，您将找到ajax；设置ajax=false，那么它就可以正常工作。

我也面临同样的问题，设置ajax=false对我来说不起作用

我找到的解决方案是通过onstart更改onclick

primefaces似乎使用onclick来处理ajax操作，因此当onclick返回值true或false时，整个操作将中止

---

如果onstart返回true，操作将继续执行，如果返回false，操作将中止。

我也面临同样的问题，设置ajax=false对我来说不起作用

我找到的解决方案是通过onstart更改onclick

primefaces似乎使用onclick来处理ajax操作，因此当onclick返回值true或false时，整个操作将中止

使用onstart，如果返回true，操作将继续执行，如果返回false，操作将中止。

按如下方式执行：

<p:commandLink update="Image1" action="#{cityDetail.removeImage}"
   onstart="return confirm('Are you sure, you want to delete the picture?')" />

这样做：

<p:commandLink update="Image1" action="#{cityDetail.removeImage}"
   onstart="return confirm('Are you sure, you want to delete the picture?')" />