Retain uploaded files for display after postback

38 posts, 0 answers
  1. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 08 Aug 2012 Link to this post

    I have a web page form that a user fills out.  The form contains many data entry fields including the RadAsyncUpload control.  When the user clicks a Submit button, a postback is triggered.  I have this button setup as the Postback Trigger on the AsyncUpload control.  As a result, I am able to successfully process the files.  However, if the user fails to enter a required data entry field or some other error occurs (unrelated to the uploaded files), then I must display an error to the user rather than continue processing the user entered form data.  When this occurs, the user must correct the errors and click the Submit but again.  However, upon returning from the initial Postback, the uploaded files no longer appear in the AsyncUpload control, so the user is forced to re-attach their files and upload them again.  How can I make the RadAsyncUpload control retain the successfully uploaded files so the user does not have to re-attach their files?

    thanks
  2. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 13 Aug 2012 Link to this post

    Hello Scott,

    I am afraid that it is not possible to achieve such aim. My suggestion is to submit the form with the postback trigger after you have done all validations. E.g. first you postback and do all checks and calculations and if everything is fine the postback trigger is enabled and you could submit the page with it.

    Regards,
    Peter Filipov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 13 Aug 2012 Link to this post

    Thanks for your reply.  I have implemented a work around whereby I put a "hidden" button on the web page that serves as the RadAsyncUpload postback trigger.  When the user clicks the visible "Submit" button on the form, a postback is fired (not affecting the file upload) and I perform all validations.  If the validation passes, then I initiate a javascript call to "click" the hidden button which then triggers the postback which causes the RadAsyncUpload to upload the file.  Is this what you are describing as a solution in your reply?

    scott
  5. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 14 Aug 2012 Link to this post

    Hi Scott,

    That was exactly what I meant. I am happy to hear that it works for you.

    Let me know if you need further assistance.

    All the best,
    Peter Filipov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  6. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 14 Aug 2012 Link to this post

    Thanks.

    This should be a common issue for most folks, so I hope that your team is able to enhance the control to make the solution easier and more seamless.

    scott
  7. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 16 Aug 2012 Link to this post

    Hello Scott,

    We are going to consider your suggestion and eventually log it in our tracking system.
    The issue here is that a validation is done when a PostbackTrigger do the postback. This could be avoided by separating the business logic and fire the PostbackTrigger as a last step in the logical chain.

    Kind regards,
    Peter Filipov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  8. Paul J
    Paul J avatar
    101 posts
    Member since:
    Nov 2008

    Posted 04 Oct 2012 Link to this post

    Having this same problem.

    @Telerik, or @ScottB, can one of you post an example of the code that uses the workaround? I'm not quite following how to seperate the postbacktrigger with the regular submit click.

    thanks.
  9. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 09 Oct 2012 Link to this post

    Hi Paul,

    Please review the following demo. Notice how the "Submit your picture information" button is enabled after the comboboxes are selected. Only if the submit button do the postback the picture is processed.

    Kind regards,
    Peter Filipov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  10. Paul J
    Paul J avatar
    101 posts
    Member since:
    Nov 2008

    Posted 09 Oct 2012 Link to this post

    so this works if you're only doing client side validation checks? I was hoping I could run some server side validation and still retain the selected file.

    is there a way on the server side to keep track of the file path of the selected file and then set the selected file back to that filepath after the postback finishes?
  11. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 09 Oct 2012 Link to this post

    Hello,

    I forgot to post my code example...here you go.

    ASPX code…

    RadAsyncUpload control. . .

    <telerik:RadAsyncUpload

    ID="Form_Attachments"

           runat="server"

           TargetFolder="~\App_Data\RadUploadTarget"

           TemporaryFolder="~\App_Data\RadUploadTemp"

           PostbackTriggers="Form_SubmitButton ">

    </telerik:RadAsyncUpload>

     

    Validate button. . .

    <asp:Button

    ID="Form_SubmitButtonValidate"

    runat="server"

    CssClass="basicButton"

    Text="Submit"

    onclick="Form_SubmitButtonValidate_Click" />


    Hidden submit button. . . (uses image button with spacer.gif to make it invisible)

    <asp:ImageButton

    ID="Form_SubmitButton"

    runat="server"

    ImageUrl="~/Images/spacer.gif"

    ToolTip=""

    AlternateText=""

    onclick="Form_SubmitButton_Click" />

     

    ASPX C# code behind...

    protected void Form_SubmitButtonValidate_Click(object sender, System.EventArgs e)

    {

        // Do server side validation here...

     

        // If server side validation succeeds, then execute javascript to trigger

        // event Form_SubmitButton_Click.

        string _javascript = "var _button = document.getElementById('" +

    this.Form_SubmitButton.ClientID + "'); if (_button != null) {_button.click();}";

        if (ScriptManager.GetCurrent(this.Page) != null)

        {

            // When in AJAX context...

            ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), "submitForm",

                    _javascript,true);

        }

        else

        {

            // When NOT in AJAX context...

            this.Page.ClientScript.RegisterStartupScript(this.GetType(), "submitForm",

             _javascript, true);

        }

    }

    /// <summary>

    /// Postback event to save form data...

    /// </summary>

    /// <param name="sender"></param>

    /// <param name="e"></param>

    protected void Form_SubmitButton_Click(object sender, ImageClickEventArgs e)

    {

        // Do server side logic to save validated form data...

    }

     
    User clicks Form_SubmitButtonValidate which triggers event Form_SubmitButtonValidate_Click.  This issues a server PostBack, but is NOT recognized by the RadAsyncUpload control as a PostbackTrigger, so RadAsyncUpload remains unchanged.


    In Form_SubmitButtonValidate_Click event, the form validation logic is performed and if successful, javascript is triggered to click the hidden image button called Form_SubmitButton (see in ASPX code).  This causes the server PostBack and is recognized by the RadAsynUpload as a PostbackTrigger.

    scott
  12. Paul J
    Paul J avatar
    101 posts
    Member since:
    Nov 2008

    Posted 09 Oct 2012 Link to this post

    Scott, thanks, I may give it a go. Much appreciated.
  13. Devinder
    Devinder avatar
    2 posts
    Member since:
    Feb 2013

    Posted 08 Feb 2013 Link to this post

    Hi Can anyone please let me know the solution for retaking the file names for async file upload. 
    Regards,
    Devinder
  14. Plamen
    Admin
    Plamen avatar
    2734 posts

    Posted 13 Feb 2013 Link to this post

    Hi Devinder,

     
    You can persist the uploaded files from processing by setting the PostbackTriggers to the appropriate button as it is explain in this documentation article

    If you mean something else by "retaking the file names" please elaborate the scenario a little bit because it is not quite clear.

    All the best,
    Plamen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  15. Ana
    Ana avatar
    1 posts
    Member since:
    Apr 2013

    Posted 24 May 2013 Link to this post

     
  16. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 17 Jul 2013 Link to this post

    Has there been any improvements on this without using the hidden button method?

    Basically i want server side validation. If this validation fails, i want the asynupload to retain its file list.

    Is there a cleaner way?
  17. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 19 Jul 2013 Link to this post

    I've tried the code above, but it doesn't seem to work.

    In the Form_Submit_Validate_Click handler, the radAsyncUplolad1.UploadedFiles.Count is always zero.

    So how can i serverside validate any of the uploaded files before submission?
  18. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 19 Jul 2013 Link to this post

    The issue and corresponding solution that I posted is not designed to allow validation of the uploaded files.  Rather, it is designed to allow validation of other data entered by the user without losing the files selected by the user for upload in the event that the validation fails.

    Here is the scenario that my code resolves:
    1. User enters some data on the web page.
    2. User uploads (using RadUpload) files.
    3. User clicks a Submit button.
    4. System performs server side validation of user entered data from step #1.
    5. Validation fails for some reason.
    6. System displays message.
    7. User re-enters problem data on the web page.
    8. User clicks Submit again.
    9. Server side validation succeeds.
    10.  User entered data AND uploaded files are processed.

  19. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 19 Jul 2013 Link to this post

    Ahhh... I see. 

    Does anyone know if it's possible to validate the uploaded filed and persist the uploaded files on a failed validation?

    I would think this would be a fairly common request.

    Maybe one of the telerik staff can chime in here.
  20. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 19 Jul 2013 Link to this post

    Hi ScottB,

    I've continued with your solution, but the javascript doesn't seem to trigger the button click. The button is always null. Could this be because i'm using radbuttons instead of regular asp buttons?

    Should the validate button be set to AutoPostBack=False?
  21. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 19 Jul 2013 Link to this post

    To determine if your javascript issue is related to using a RadButton instead of an ASP button, simply use an ASP button. 

    As to your question regarding Autopostback=False, no.  The button click must trigger a Postback.
  22. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 19 Jul 2013 Link to this post

    I also recommend debugging the Form_SubmitButtonValidate_Click event and validating that the ClientID of the validation button (used in the javascript to find the button) matches the value of the button when you view the page source of the rendered web page.  If the ClientID does not map to an element in the page source, then the javascript function getElementById will not find the button.  Thus, _button will be null.
  23. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 21 Jul 2013 Link to this post


    Hmm... I think there's something else going on here. if i change your code and add an alert i get "object htmlspanelement" back rather than "object htmlinputelement" or the button.

    I then changed my form to use a normal asp button and everything works great.

    Originally i had modified your javascript to use $find() to get a reference to the radbutton. That function always returned null. I'm still unclear why? Could one of the telerik folks chime in and explain this?

    Thanks.
     
  24. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 22 Jul 2013 Link to this post

    Hi,

    We are going to research this more deeply and will get back to you with more information.

    Regards,
    Hristo Valyavicharski
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  25. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 22 Jul 2013 Link to this post

    Great thanks for looking into this.

    Another issue i'm running into is i cant' redirect to a success page after a successful submission.

    In the Form_SubmitButton_Click handler i do a Response.Redirect() which does nothing. I've also tried Server.Transfer().

    Hmmm... 

  26. ScottB
    ScottB avatar
    9 posts
    Member since:
    Aug 2012

    Posted 22 Jul 2013 Link to this post

    I'm not sure what else I can do for you Andre.  The code I posted definitely works.  I am using Master Pages and my page is wrapped in an AJAX Update Panel.  My solution is pretty simple as it uses basic ASP.Net concepts.
  27. Andre
    Andre avatar
    30 posts
    Member since:
    Dec 2012

    Posted 22 Jul 2013 Link to this post

    I don't think you can. When i switch to the controls you use, everything works fine.

    Thanks for your help Scott. I really appreciate it. The telerik guys are looking into the radbutton vs button issue.
  28. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 25 Jul 2013 Link to this post

    Hi,

    we made a detailed research on this issue, but we didn't manage to find another working approach. Andre I suggest you to use Scott's solution. It is working fine. The issue with the buttons is expected. $find can be used only for Ajax controls. If you use non-ajax controls you should use $get. Difference between both is well explain here.

    Regards,
    Hristo Valyavicharski
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  29. Albert Shenker
    Albert Shenker avatar
    551 posts
    Member since:
    Mar 2004

    Posted 12 Mar 2014 in reply to Hristo Valyavicharski Link to this post

    I'd like to chime in on this topic. The solution proposed of using a separate submission imitator (hidden button), works in order to perform server-side validation of various form fields that exist in conjunction with AsyncUpload. The solution isn't particularly elegant, but it works.

    The problem is, how do we perform server-side validation on the uploaded file itself, and it would appear Telerik has no answer for this. From my standpoint, it isn't necessary to get access to the file server-side and validate all its attributes (file size, illegal file types, etc.), because all of this can be handled client-side. However, there is one form of validation that is required server-side.... Required Field Validation. If the AsyncUpload is a required field, then there doesn't appear to be any way to validate it prior to submitting the file. Surely there must be some way to ascertain whether a file has been uploaded server-side without actually submitting the file, seeing as a temporary file does get created. I'm hoping Teleric is working on a way to determine this server-side prior to submitting a file. Perhaps a property like RadUpload.FileIsUploaded (True/False), or something to that affect.
  30. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 17 Mar 2014 Link to this post

    Hi Albert,

    At the moment the only one way to implement a server side validation is to use a Custom Handler and perform the validation in the Process() method and return a custom result on the client. At the moment we are working to improve the server side validation process of the AsyncUpload control.

    Regards,
    Hristo Valyavicharski
    Telerik
     

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

     
  31. Albert Shenker
    Albert Shenker avatar
    551 posts
    Member since:
    Mar 2004

    Posted 17 Mar 2014 in reply to Hristo Valyavicharski Link to this post

    Thanks. I look forward to seeing what you guys come up with.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017