Question

richfaces fileUpload组件上有清晰，清晰的所有按钮。

<rich:fileUpload id="quoteFile" tabindex="10" listHeight="80" maxFilesQuantity="1" onuploadcanceled="" 
 clearControlLabel=""
 clearAllControlLabel=""
 acceptedTypes="xml"
 fileUploadListener="#{loadSaveQuotes.uploadListener}">     
 <a4j:support event="onuploadcanceled" action="#{loadSaveQuotes.clearUploadData}" reRender="footer"  />
</rich:fileUpload>

我想要的只是：

1，删除这两个按钮，以便最终用户无法单击它。因为我将clearControlLabel设置为“”，并将clearAllControlLabel设置为“”，但只隐藏了clearControlLabel。仍然有清除所有控件显示为[x]按钮，我仍然点击它

2，如果我无法删除这些按钮，那么我该如何控制它们。比如在clear事件上添加一个事件监听器。我添加了一个a4j：support事件，但是当我点击清除按钮时它不会触发。

非常感谢你的贡献。

Answer 1

添加a4j：支持'onclear'JavaScript事件。代码不言自明：

<rich:fileUpload id="upload">
    <a4j:support event="onclear" reRender="upload"/>
</rich:fileUpload>

Answer 2

您可以通过CSS隐藏这些按钮，例如你可以给你的文件上传一个额外的类，如

<rich:fileUpload styleClass="my-upload"> etc. </rich:fileUpload>

然后使用CSS Specificity来否决此fileupload组件的外观：

.my-upload .rf-fu-btns-rgh, .my-upload .rf-fu-itm-rgh {
    display: none;
}

您可以选择具有比RichFaces中原始选择器更高特异性的任何选择器组合。我发现有一个额外的类是最干净的解决方案，因为它允许我将“正常”和“修改”的RichFaces组件彼此相邻，只是它们的样式类别不同。

您可以在RichFaces component documentation或您喜欢的网站检查工具中查找要更改的元素的RichFaces样式类。

Answer 3

我有同样的要求。隐藏全部清除按钮和清除链接，但仅在提交文件进行上载时。我通过JavaScript用动态css解决了这个问题。以下是示例。

rich：fileUpload control

<rich:fileUpload id="excelUploader"
                fileUploadListener="#{uploadUIController.excelFileUploadListener}"
                acceptedTypes=".xls" 
                maxFilesQuantity="1" 
                noDuplicate="true"
                ontyperejected="Wrong file type selected !"
                serverErrorLabel="Invalid file type selected !" 
                listHeight="100px" 
                doneLabel="Excel Upload Completed !" 
                onfilesubmit="showHideClearLink()"
                styleClass="fileUploadClass"/>

文件顶部的Javascript代码......

<script type="text/javascript">
function showHideClearLink()
{
var styleSheet = document.createElement('style')
styleSheet.innerHTML = ".fileUploadClass .rf-fu-btns-rgh, .fileUploadClass .rf-fu-itm-rgh {display: none;}"; 
document.body.appendChild(styleSheet);
}

如何将事件添加到richfaces fileUpload“on clear”

3 个答案: