display image after upload

6 posts, 0 answers
  1. Ted
    Ted avatar
    47 posts
    Member since:
    Jan 2008

    Posted 25 Jul 2010 Link to this post

    I am trying to get a simple AsyncUpload to show the image after it's uploaded to the temporary folder.  is there a way to do this and do you have any examples of this?
    I am using the Q2 2010 version

    I'm using this
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="Thumbnail" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>

        <telerik:RadAjaxLoadingPanel runat="server" ID="LoadingExamplePanel">
        </telerik:RadAjaxLoadingPanel>
        <span class="info"></span>
        <div class="imageContainer">        
            <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" Skin="Forest" TargetFolder="~/images/Boats" 
                OnClientFileUploaded="fileUploaded" OnClientDeleting="clientDeleting"
                onfileuploaded="RadAsyncUpload1_FileUploaded1">
            </telerik:RadAsyncUpload>   

            <telerik:RadBinaryImage ID="Thumbnail" runat="server" />




    and











     protected void RadAsyncUpload1_FileUploaded1(object sender, FileUploadedEventArgs e)
            {
                Stream fileStream = e.File.InputStream;           
                byte[] imageData = new byte[e.File.InputStream.Length];
                fileStream.Read(imageData, 0, (int)e.File.InputStream.Length);
                Thumbnail.DataValue = imageData;            
                fileStream.Close();
            }

  2. Yana
    Admin
    Yana avatar
    4554 posts

    Posted 26 Jul 2010 Link to this post

    Hi Ted,

    Please check this online example which demonstrates similar approach.

    All the best,
    Yana
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ted
    Ted avatar
    47 posts
    Member since:
    Jan 2008

    Posted 26 Jul 2010 Link to this post

    I saw that demo and started with it.  my issue is instead of adding an image control or clearing it I want to update an existing image control.  And I don't want to use a database but simply show the file that is uploaded to the temp directory.
  5. Yana
    Admin
    Yana avatar
    4554 posts

    Posted 29 Jul 2010 Link to this post

    Hi Ted,

    I've attached a simple page to demonstrate how to achieve the needed approach, please download it and give it a try.

    All the best,
    Yana
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  6. Fit2Page
    Fit2Page avatar
    345 posts
    Member since:
    Feb 2007

    Posted 25 Apr 2014 Link to this post

    Thank you yana this works very good.
    Could you look how to integrate a AjaxLoadingpanel into this example.
    I can't get this right to work...

    Marc
  7. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 29 Apr 2014 Link to this post

    Hello,

    Please try the following approach:

    //markup code
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
        OnAjaxRequest="RadAjaxManager1_AjaxRequest">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="Thumbnail" LoadingPanelID="LoadingPanel1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel ID="LoadingPanel1" runat="server" Width="256px" Height="64px" MinDisplayTime="2000">
        <asp:Label ID="Label2" runat="server" ForeColor="Red">Loading... </asp:Label>
    </telerik:RadAjaxLoadingPanel>
    <span class="info"></span>
    <div class="imageContainer">
        <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" TargetFolder="~/images/Boats"
            OnClientFileUploaded="flieUploaded">
        </telerik:RadAsyncUpload>
     
        <telerik:RadBinaryImage ID="Thumbnail" runat="server" />
    </div>



    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017