Hide browse button for UploadPersistedFile control

Last post 10-10-2008, 3:04 AM by cutechat. 11 replies.
Sort Posts: Previous Next
  •  10-04-2008, 8:38 AM 44551

    Hide browse button for UploadPersistedFile control

    Hello,
     
    I am creating a customized upload control that easily allows me to upload / remove images web forms. The control should look like this:
     
     
    However, currently, it looks like this:
     
     
    This is the code I use:
     
        <%-- Uploader --%>
        <CuteWebUI:UploadPersistedFile runat="server" ID="imageUploader" UploadType="Auto" MultipleFilesUpload="false"
            InsertButtonID="editButton" CancelButtonID="cancelButton" ProgressCtrlID="imageUploaderProgress"   
            OnFileUploaded="imageUploader_FileUploaded" OnFileChanged="imageUploader_FileChanged">
            <ValidateOption AllowedFileExtensions="jpg,jpeg,gif,png" />
        </CuteWebUI:UploadPersistedFile>
     
    Why is the browse button still visible?
     
    Thanks in advance!
  •  10-04-2008, 10:11 PM 44557 in reply to 44551

    Re: Hide browse button for UploadPersistedFile control

    Hi
     
    Can you show all the HTML code ?
     
     
    the "editButton" must be a server control , otherwise uploader control would ignore that property if "editButton" not found at server side.
     
    So do other XxxID properites.
     
     
    Regards , Terry .
  •  10-05-2008, 9:24 AM 44577 in reply to 44557

    Re: Hide browse button for UploadPersistedFile control

    Here you go. It's the complete xml code for the user control:

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ImageUploader.ascx.cs" Inherits="CatenaLogic.Website.Controls.ImageUploader" %>

    <div class="imageUploader">
        <%-- Image --%>
        <asp:Image ID="imageUploaderImage" runat="server" CssClass="photo" />
       
        <%-- Controls --%>
        <div class="controls">
       
            <%-- Progress --%>
            <asp:Panel ID="imageUploaderProgress" runat="server" CssClass="progress" />
           
            <%-- Buttons --%>
            <asp:LinkButton ID="editButton" runat="server" CssClass="editButton" meta:resourcekey="editButtonResource" />
            <asp:LinkButton ID="cancelButton" runat="server" CssClass="cancelButton" meta:resourcekey="cancelButtonResource" />
            <asp:LinkButton ID="removeButton" runat="server" CssClass="removeButton" meta:resourcekey="removeButtonResource" />
       
        </div>
       
        <%-- Uploader --%>
        <CuteWebUI:UploadPersistedFile runat="server"  ID="imageUploader" UploadType="Auto" MultipleFilesUpload="false"
            CancelButtonID="cancelButton" InsertButtonID="editButton" ProgressCtrlID="imageUploaderProgress"   
            OnFileUploaded="imageUploader_FileUploaded" OnFileChanged="imageUploader_FileChanged">
            <ValidateOption AllowedFileExtensions="jpg,jpeg,gif,png" />
        </CuteWebUI:UploadPersistedFile>
    </div>

  •  10-05-2008, 9:46 PM 44587 in reply to 44551

    Re: Hide browse button for UploadPersistedFile control

    Hi CatenaLogic,
     
    As long as you change the id of uploader(imageUploader) or image(imageUploaderImage),the issue will be solved,because the two  ID co-exist will bring script conflict.
     
    Regards
     
    Ken
  •  10-05-2008, 11:51 PM 44591 in reply to 44587

    Re: Hide browse button for UploadPersistedFile control

    Thank you very much, this seems to work. I also had to change the progress bar name.
     
    I have another simple question: I forgot to copy ajaxuploader.lic to the bin directory. Then, the control complained about a license. Is the license checked cached or is it really checked every call (that would be a huge performance hit)?
  •  10-06-2008, 1:07 AM 44594 in reply to 44551

    Re: Hide browse button for UploadPersistedFile control


    CatenaLogic,
     
    only check once
     
    Ken
  •  10-06-2008, 8:37 AM 44622 in reply to 44594

    Re: Hide browse button for UploadPersistedFile control

    I now have this source:
     
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ImageUploader.ascx.cs" Inherits="CatenaLogic.Website.Controls.ImageUploader" %>

    <div class="imageUploader">

    <%-- Image --%>

    <asp:Image ID="previewImage" runat="server" CssClass="photo" />

     

    <%-- Controls --%>

    <div class="controls">

     

    <%-- Progress --%>

    <asp:Panel ID="uploadProgress" runat="server" CssClass="progress" />

     

    <%-- Buttons --%>

    <asp:LinkButton ID="editButton" runat="server" CssClass="editButton" meta:resourcekey="editButtonResource" />

    <asp:LinkButton ID="cancelButton" runat="server" CssClass="cancelButton" meta:resourcekey="cancelButtonResource" />

    <asp:LinkButton ID="removeButton" runat="server" CssClass="removeButton" meta:resourcekey="removeButtonResource" />

     

    </div>

     

    <%-- Uploader --%>

    <CuteWebUI:UploadPersistedFile runat="server" ID="imageUploader" UploadType="Auto" MultipleFilesUpload="false"

    CancelButtonID="cancelButton" InsertButtonID="editButton" ProgressCtrlID="uploadProgress" ShowProgressInfo="false"

     

    OnFileUploaded="imageUploader_FileUploaded" OnFileChanged="imageUploader_FileChanged">

    <ValidateOption AllowedFileExtensions="jpg,jpeg,gif,png" />

    </CuteWebUI:UploadPersistedFile>

    </div>

    Initially, the control looks fine:
     
    However, when I select a file to upload, I get this error:
     
     
     
     
    Any ideas what can be wrong? As you can see, the progress bar does not show in the progressbar at the top.
     
    Also, is it possible to hide the browse button during the uploading process? I want the upload (edit) button to be replaced by the cancel upload button during the upload process.
     
     Thanks in advance!
  •  10-07-2008, 4:15 AM 44650 in reply to 44551

    Re: Hide browse button for UploadPersistedFile control

    Hi tenaLogic,
     
    Please post your codebehind.
     
    Ken
  •  10-07-2008, 4:25 AM 44651 in reply to 44650

    Re: Hide browse button for UploadPersistedFile control

    public partial class ImageUploader : System.Web.UI.UserControl
     
    {

    #region Variables

    private string _uploadFolder = "~/Upload/Temp";

    private string _imageHandler = "";

    #endregion

    #region Constructor & destructor

    #endregion

    #region Properties

    /// <summary>

    /// Gets or sets the upload folder

    /// </summary>

    public string UploadFolder

    {

    get

    {

    return _uploadFolder;

    }

    set

    {

    _uploadFolder = value;

    }

    }

    /// <summary>

    /// Gets or sets the image handler url

    /// </summary>

    public string ImageHandler

    {

    get

    {

    return _imageHandler;

    }

    set

    {

    _imageHandler = value;

    }

    }

    #endregion

    #region Methods

    protected void Page_Load(object sender, EventArgs e)

    {

    // Set values

    imageUploader.TempDirectory = _uploadFolder;

    }

    protected void imageUploader_FileUploaded(object sender, UploaderEventArgs args)

    {

    try

    {

    using (Stream stream = args.OpenStream())

    {

    System.Drawing.Bitmap img = new System.Drawing.Bitmap(stream);

    img.Save(args.GetTempFilePath(), System.Drawing.Imaging.ImageFormat.Png);

    }

    }

    catch (Exception ex)

    {

    args.Delete();

    }

    }

    protected void imageUploader_FileChanged(object sender, PersistedFileEventArgs args)

    {

    previewImage.ImageUrl = string.Format("{0}?id={1}", _imageHandler, args.FileGuid);

    }

    #endregion

    }

  •  10-07-2008, 8:39 PM 44671 in reply to 44651

    Re: Hide browse button for UploadPersistedFile control

     
     
    imageUploader.TempDirectory = _uploadFolder;
     
     
    Please do not use the TempDirectory property any mode.
     
    While the uploader have been upgrated to v2.0 , this property is not compatible with the Flash upload mode.
     
    We haven't prepaired the document on this issue , sorry.
     
    If you want to change the default , you can set it at web.config appSettings :
     
    <add key="CuteWebUI.AjaxUploader.TempDirectory" value="~/TempDirectory" />
     
    you can specify a physical path too, for example "d:\temp" or "\\server2\shared folder"
     
    Regards , Terry.
  •  10-08-2008, 5:05 AM 44686 in reply to 44671

    Re: Hide browse button for UploadPersistedFile control

    Thank you for your reply.
     
    In that case, I have a new feature request: make it available in the control itself again. The reason for this is that I want to be able to simply add the user control to a page and I don't want to modify the web.config (which doesn't make sense in case of a user control).
  •  10-10-2008, 3:04 AM 44759 in reply to 44686

    Re: Hide browse button for UploadPersistedFile control

    Hi
     
    Please download the new version. this feature is available now.
     
    Regards , Terry.
View as RSS news feed in XML