Telerik
Skip Navigation LinksHome / Community / Forums / ASP.NET AJAX > Upload > Custom code after file upload

Answered Custom code after file upload

Feed from this thread
  • Nick avatar

    Posted on May 20, 2009 (permalink)

    How would I have some processing of the file take place after, before, or instead of saving the file when I am placing the submit button inside the upload div with the javascript pageLoad function like in the documentation?

    I can see how to access the file in the documentation, but this is done in the submit buttons event handler.  How can I do some custom processing on the file if I am placing the submit button inside the upload div with the javascript pageLoad function?

    Please help.

    Thanks,
    Nick

    Reply

  • Nick avatar

    Posted on Jun 3, 2009 (permalink)

    So is this not possible?

    Anybody, please.

    Thanks,
    Nick

    Reply

  • Telerik Admin admin's avatar

    Posted on Jun 8, 2009 (permalink)

    Hi Nick,

    In order to have a serverside event, you need to declaratively create the upload button like this:

            <telerik:RadUpload runat="server" ID="RadUpload1">
            </telerik:RadUpload>
            <asp:Button runat="server" ID="Button1" Text="Postback"
                onclick="Button1_Click" />


    and then append it to the RadUpload div using JavaScript:

    1) Using pure JavaScript:

    function pageLoad() { 
                var button = document.getElementById('Button1'); 
                var btnAdd = document.getElementsByClassName('ruAdd')[0]; 
                button.className = "ruButton"
                btnAdd.parentNode.insertBefore(button, btnAdd); 
            } 

    2) Using jQuery:

    function pageLoad() { 
                $("#Button1").insertBefore(".ruAdd").addClass("ruButton"); 
            } 

    Sample project is attached.

    Regards,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
    Attached files

    Reply

  • Nick avatar

    Posted on Jun 8, 2009 (permalink)

    Thanks for your reply Genady, but that did not work for me.  I get a "Object reference not set to an instance of an object" error.  I'm not sure if it matters but I am using the Web20 skin.  I also noticed the getElementsByClassName finction did not show up in my intellisense.  Do you have any other ideas for me?

    Thanks,
    Nick

    Reply

  • Telerik Admin admin's avatar

    Posted on Jun 9, 2009 (permalink)

    Hi Nick,

    You can use jQuery instead of a pure javascript, more information on how to use jQuery with intellisense can be found here. document.getElementsByClassName does not show up in the intellisense because it is not a standard method, despite that it is supported in all common browsers. As for the object reference error, this sounds strange, can you provide me with a sample of your code?

    Kind regards,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.

    Reply

  • Nick avatar

    Posted on Jun 9, 2009 (permalink)

    I tried both the jQuery and the pure javascript with the same result.  The error comes when the page loads, not when performing an upload.

    Here is my code:

    My button event handler:
    protected void btnUpload_Click(object sender, EventArgs e)
        {
            var em = GetExchangeMember(this.TabId);

            foreach( UploadedFile file in uploadCtrl.UploadedFiles )
            {
                BinaryReader b = new BinaryReader(file.InputStream);
                byte[] binData = b.ReadBytes(file.ContentLength);

                var dType = GetDataType(this.TabId);

                Med.File.Send(file.GetName(), binData, em, dType);
            }
        }

    My user control:
    <asp:ScriptManager runat="server" ID="ScriptManager1">
        <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>
    </asp:ScriptManager>

    <script type="text/javascript">
    function pageLoad()
    {
        var button = document.getElementById('btnUpload');
        var btnAdd = document.getElementsByClassName('ruAdd')[0];
        button.className = "ruButton";
        btnAdd.parentNode.insertBefore(button, btnAdd);

        //$("#btnUpload").insertBefore(".ruAdd").addClass("ruButton");
    }
    </script>

    <br /><b>Browse for the file and click Upload</b><hr /><br />
    <telerik:radupload runat="server" ID="uploadCtrl"
        MaxFileInputsCount="5"
        Skin="Web20"></telerik:radupload>
    <asp:Button ID="btnUpload" runat="server" Text="Upload"
        onclick="btnUpload_Click" />
    <telerik:radprogressarea runat="server" ID="progressArea"
        DisplayCancelButton="True"
        ProgressIndicators="FilesCountBar,
                            FilesCount,
                            FilesCountPercent,
                            SelectedFilesCount,
                            CurrentFileName,
                            TimeElapsed,
                            TimeEstimated">
        <Localization Uploaded="Uploaded"></Localization>
    </telerik:radprogressarea>
    <telerik:radprogressmanager runat="server" ID="progressManager"></telerik:radprogressmanager>

    Your help is greatly appreciated

    Thanks,
    Nick






    Reply

  • Telerik Admin admin's avatar

    Posted on Jun 10, 2009 (permalink)

    Hello Nick,

    I have tested your code after I removed the following from your btnUpload_Click handler

    var em = GetExchangeMember(this.TabId);

    var dType = GetDataType(this.TabId);
    Med.File.Send(file.GetName(), binData, em, dType);


    I have removed the upper lines because I do not have the corresponding methods. So, the code was working as expected and no "object reference not set to an instance of an object" error was present. Therefore the removed lines of code are causing the fault. This has nothing to do with the upload or the upload button. I suggest you to debug your application and observe where and why the error is thrown.


    Sincerely yours,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.

    Reply

  • Nick avatar

    Posted on Jun 11, 2009 (permalink)

    I have narrowed the problem down to the <asp:ScriptManager .  My project is a module for a DotNetNuke site.  DNN is not playing nice with the script manager added in the ascx file.  I tried getting a reference to the script manager already on the page and adding the script reference in the pageLoad  Like this:

    ScriptManager scriptManager = ScriptManager.GetCurrent(this.Page);
    ScriptReference srf1 = new ScriptReference();
    srf1.Assembly = "Telerik.Web.UI";
    srf1.Name = "Telerik.Web.UI.Common.Core.js";
    scriptManager.Scripts.Add(srf1);

    However, nothing happened, it ran just fine but the button remained outside of the control.  I'm running out of ideas.  I'm pretty sure now that the problem stems from this being a user control or a DNN module.

    Thanks,
    Nick

    Reply

  • Telerik Admin admin's avatar

    Posted on Jun 12, 2009 (permalink)

    Hello Nick,

    Do you have a ScriptManager in your aspx page? If so, you cannot ScirptManager to your user control. You need to use ScriptManagerProxy instead. You can add reference in the same way as with the original ScriptManager.  Example:

            <asp:ScriptManagerProxy runat="server" ID="ScriptManager1> 
            </asp:ScriptManagerProxy> 


    ScriptManager1.Scripts.Add(....) 

    So, If I have understood you correctly: If the submit button is not in the upload div, everything works as expected. If you move the button inside, a problem follows up?

    All the best,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.

    Reply

  • Nick avatar

    Posted on Jun 16, 2009 (permalink)

    Sorry for the delayed response.  I get working on another page.  This page has actually been accepted with the upload button below the control. 

    I'm sure the problem was with script manager conflicts in DotNetNuke.  Sorry I don't have anymore time to invest in this slight UI enhancement.

    Thank you,
    Nick

    Reply

  • Answer Bruno avatar

    Posted on Jun 16, 2009 (permalink)

    Hi,
    i found one problem with styles, the solution for me was

    where (in line 2)

    1 function pageLoad() {    
    2             var button = document.getElementById('Button1');    
    3             var btnAdd = document.getElementsByClassName('ruAdd')[0];    
    4             button.className = "ruButton";    
    5             btnAdd.parentNode.insertBefore(button, btnAdd);    
    6         }    
    7  

    change to

    1 function pageLoad() {    
    2             var button = document.getElementById('<%= Button1.ClientID %>');    
    3             var btnAdd = document.getElementsByClassName('ruAdd')[0];    
    4             button.className = "ruButton";    
    5             btnAdd.parentNode.insertBefore(button, btnAdd);    
    6         }    
    7  

    Thats is all.

    Thanks,
    Bruno.

    Reply

  • Nick avatar

    Posted on Jun 16, 2009 (permalink)

    Sweet!  It works.

    Thank you very much,
    Nick

    Reply

  • Nick avatar

    Posted on Jun 22, 2009 (permalink)

    OK, so it works in Firefox.  However, IE it does not.  In IE I get this script error:

    Object doesn't support this property or method.

    I think it come from this line:

    var btnAdd = document.getElementsByClassName('ruAdd')[0];

    Is there another way to this so that it works in Firefox and IE

    Thank you,
    Nick



    Reply

  • Telerik Admin admin's avatar

    Posted on Jun 24, 2009 (permalink)

    Hi Nick,

    You can use the following syntax:

    var btnAdd = document.getElementById('you upload id' + 'AddButton'); 

    So if your RadUpload has an ID "RadUpload1", you should use:

    var btnAdd = document.getElementById('RadUpload1AddButton'); 

    You can use FireBug or IE developers tool to examine what is the id of the AddButton you want to access. An alternative solution might be to use jQuery or another JavaScript library that emulates the getElementsByClassName functionality.

    Kind regards,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.

    Reply

Back to Top

Skip Navigation LinksHome / Community / Forums / ASP.NET AJAX > Upload > Custom code after file upload
Related resourses for "Custom code after file upload"

ASP.NET Upload Features  |  Documentation  |  Demos  |  Telerik TV  |  Self-Paced Trainer  |  Step-by-step Tutorial  ]

Powered by Sitefinity ASP.NET CMS

Contact Us | Site Feedback | Terms of Use | Privacy Policy
Copyright © 2002-2010 Telerik. All rights reserved.