I am having a problem validating the Async File upload control, using a Custom Validator and JavaScript.
The JS I'm using is:
function isAttachmentValid(sender, args) {
var upload = $find("<%= RadUpload1.ClientID %>");
args.IsValid = upload.getUploadedFiles().length != 0;
}
This works perfectly fine if I submit the form right away, but if I save the form and come back to it upload.getUploadedFiles().length always = 0 and validation fails.
I should also note that I don't have access the server-side code so validation must be done on the client.
5 Answers, 1 is accepted
Please check this out: AsyncUpload Server Validation.
Regards,
Hristo Valyavicharski
Telerik
Rank 1
Hi Hristo,
Thanks for that but I don't have access to the back-end code (C#/VB) that my application is using, therefore I can only do validation on the client (in JavaScript/Jquery). I have tried the following, but the validation fails if the form is saved and reloaded (it works if you submit right away).
function isAttachmentValid(sender, args) {
debugger;
var upload = $find("<%= RadUpload1.ClientID %>");
args.IsValid = upload.getUploadedFiles().length != 0;
}
http://demos.telerik.com/aspnet-ajax/asyncupload/examples/validation/defaultcs.aspx
http://docs.telerik.com/devtools/aspnet-ajax/controls/asyncupload/overview.html
To handle the case where files with size of 0 bytes are uploaded you may use this:
<form id="form1" runat="server"> <asp:ScriptManager runat="server" ID="scriptManager"></asp:ScriptManager> <telerik:RadAsyncUpload runat="server" ID="async" MultipleFileSelection="Automatic" OnClientFilesSelected="filesSelected" OnClientFileUploading="fileUploading"> </telerik:RadAsyncUpload> <script type="text/javascript"> var invalidFiles = []; function filesSelected(sender, args) { var files = sender._fileInput.files; for (var i = 0; i < files.length; i++) { if (files[i].size === 0) { invalidFiles.push(files[i].name); } } } function fileUploading(sender, args) { if (invalidFiles.indexOf(args.get_fileName()) !== -1) { args.set_cancel(true); console.log(args.get_fileName()); } } </script></form>Regards,
Hristo Valyavicharski
Telerik
Rank 1
Hi Hristo,
I want to validate that at least one file has been uploaded when submitting the form. This must be in done JavaScript.
To do this I am currently using getUploadedFiles().length
If I upload a file and then submit the form straight away the validation works correctly and getUploadedFiles().length = 1
However, if I save the form and come back to it, the name of the file I uploaded appears underneath the control BUT getUploadedFiles().length = 0 and the validation fails, which is not what I want.
Thanks
Mark
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> <style type="text/css"> p { margin: 0; color: blue; } div, p { margin-left: 10px; } span { color: red; } </style></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <telerik:RadAsyncUpload runat="server" ID="async"> </telerik:RadAsyncUpload> <span id="msg"></span> <asp:Button runat="server" Text="Submit" /> <script type="text/javascript"> var upload; function pageLoad() { upload = $find("async"); } $("form").submit(function (event) { if (upload.getUploadedFiles().length === 0) { event.preventDefault(); } $("form").submit(function (event) { if (upload.getUploadedFiles().length !== 0) { $("#msg").text("Validated...").show(); return; } $("#msg").text("Not valid!").show().fadeOut(1000); event.preventDefault(); }); }) </script> </form></body></html>Regards,
Hristo Valyavicharski
Telerik