Help Needed in Placing Uploader in a Update Panel

Last post 01-07-2009, 1:43 PM by cutechat. 5 replies.
Sort Posts: Previous Next
  •  01-05-2009, 4:21 PM 47421

    Help Needed in Placing Uploader in a Update Panel

    hi,
     
    i came across your uploader and find it very useful component.
     
    basically i have to implement the uploader  along with other controls like textbox, drop down lists in aspx form.
     
    i followed simple-upload-Validation example and implemented the same using code behind.
     
    i placed the uploader in update panel while keeping other controls in the form(textbox,cascading drop down lists) outside update panel.
     
    structure of page is as:
     
    abc.aspx
     
    name                                              : required field validator
    country drop down list 1 (dependent) : 
    state drop down list 2 (dependent)     :
    summary                                         : required field validator
     
    SELECT A VIDEO TO UPLOAD           : ajax uploader
    (Uploader placed in update panel)
     
    link button (for Submit)                    :
     
    abc.aspx.cs page
     
    using CuteWebUI;
     

     

        protected void InsertMsg(string msg)
        {
            ListBoxEvents.Items.Insert(0, msg);
            ListBoxEvents.SelectedIndex = 0;
        }

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            SampleUtil.SetPageCache();
          
            Uploader1.FileUploaded += new UploaderEventHandler(Uploader_FileUploaded);
          
        }
     
       protected void Uploader_FileUploaded(object sender, UploaderEventArgs args)
        {
            string folder = Server.MapPath("~\\UploaderTemp");
            string videoExt = Path.GetExtension(args.FileName);
            string fileExt = videoExt.ToLower();

            string savepath = System.IO.Path.Combine(folder, "id" + fileExt);
            args.MoveTo(savepath);
            InsertMsg("File uploaded! " + args.FileName + ", " + args.FileSize + " bytes.");
        }
     
    my questions here are:
     
    1) how can a full postback be achieved at time of video selection as other form controls are having required validation which prevents the full postback and this results in non postback events. there is no file movement to destination folder as a result and no result display in server trace window.
     
    but when i make selection in the cascading drop down list again, a postback is generated resulting in displaying the messsage in server trace window.
     
    how can automatic postback be achieved  using update panel.
     
    2) how can required validation on other form controls contained on the page  be disabled while uploading the file and how can these validation again enabled after the file is uploaded.
     
    also can the form elements be disabled at the time of uploading?
    eg: where should i place statement like (submitbtn.enabled = false;) which keeps the controls on form disable while the file is in uploading process.
     
    3) i also go through post (http://cutesoft.net/forums/post/44763.aspx)in the forum.
     
     how can we disable form validation on controls(contained in page) with the help of  functions like:
     
    //fired when upload is started
    function CuteWebUI_AjaxUploader_OnStart()
    {
     var hidden=this;
     hidden.internalobject.insertBtn.style.display='none'
    }
     
    4) how can we use uploader functionality inside a link button

    eg:  protected void LinkButton1_Click(object sender, EventArgs e)
        {
           //void Uploader_FileUploaded(object sender, UploaderEventArgs args)
          //file move code
         }
     
    5) how to implement required field validation check for file selection by the uploader component.
     
    so that form is not submited without uploading a file.
     
    thanks.

     
     
     

     
     
  •  01-05-2009, 8:59 PM 47438 in reply to 47421

    Re: Help Needed in Placing Uploader in a Update Panel

    Hi

    Please check this thread about the validation controls:

    http://cutesoft.net/forums/thread/47402.aspx

    You can use Uploader1.InsertButton.ValidationGroup = "NoNeed";
     to prevent the validation control stop the uploader doing the postback.

    That should help you to fix the 1-3 questions.
    (you do not need disabled the validation controls while uploading)


    I suggest you use the UploadPersistedFile control so that you can use the uploaded file as :

    protected void LinkButton1_Click(object sender, EventArgs e)
    {
        PersistedFile file=UploadPersistedFile1.File;
        if(file!=null)
        {
            //file.MoveTo...
        }
    }

    about check whether a file have been uploaded, you can check this thread:

    http://cutesoft.net/forums/thread/47404.aspx

    You can do this way:

    <asp:UpdatePanel>
    <ContentTemplate>
    <CuteWebUI:UploadPersistedFile id=UploadPersistedFile1... />
    <asp:TextBox runat=server id=TextBox1 />
    </ContentTemplate>
    </asp:UpdatePanel>
    <script runat=server>
    protected override void OnPreRender(EventArgs args)
    {
        PersistedFile file=UploadPersistedFile1.File;
        TextBox1.Style["display"]="none";
        TextBox1.Text=(file==null?"false":"true");
    }
    </script>
    <script>
    var theboxid='<%=TextBox1.ClientID%>';
    function HasUploadedFile()
    {
        var box=document.getElementById("theboxid");
        return box.value=="true";
    }
    </script>

    Regards,
    Terry

     

  •  01-06-2009, 4:14 AM 47451 in reply to 47438

    Re: Help Needed in Placing Uploader in a Update Panel

    hi,
     
    Thanks for your help,
    my problem has been solved.
     
    Your support for the uploader is excellent.
     
    but i still want to know how i can disable certain controls on the form (eg:- cascading drop down lists) while file uploading process is going on.
     
    eg:- while the file uploading process is going on, pressing  the cascading drop down list on form produces a postback, which results in termination of upload process.
     
    so how can i disable the dropdown list during the file upload process and re-enable them again after completion of uploading process.
     
     
    I refered forum post http://cutesoft.net/forums/post/44763.aspx for the same
     
    In which function, i should  place " dropdownlist1.enabled = false;"
     
    In simple words, i want to know where and how i can use this function
    //fired when upload is started
    function CuteWebUI_AjaxUploader_OnStart()
    {
     var hidden=this;
     hidden.internalobject.insertBtn.style.display='none'
    }
     
    and other similar functions mentioned on this post http://cutesoft.net/forums/post/44763.aspx
     
     
    My Updated code in code behind page is :-
     
    protected override void OnInit(EventArgs e)
    {

    base
    .OnInit(e);
    SampleUtil
    .SetPageCache();
    PersistedFile1.InsertButton.ValidationGroup = "NoNeed";
    PersistedFile1.FileChanged += new PersistedFileEventHandler(PersistedFile_FileUploaded);
    LinkButton1.Click +=
    new EventHandler(LinkButton1_Click);
    }

     
    protected void PersistedFile_FileUploaded(object sender, PersistedFileEventArgs args)
    {
    LinkButton1.Enabled = true;
    }
     
     
    thanks.
  •  01-06-2009, 10:21 PM 47477 in reply to 47451

    Re: Help Needed in Placing Uploader in a Update Panel

    Hi,
     
    for example:
     
    function CuteWebUI_AjaxUploader_OnStart()
    {
     //this function would be called on each file start upload
     //maybe be called many times when upload multiple files.
     document.forms[0].disabled=true;
    }
    function CuteWebUI_AjaxUploader_OnStop()
    {
     //this function would be called if get error or user cancel it.
     document.forms[0].disabled=false;
    }
    function CuteWebUI_AjaxUploader_OnPostback()
    {
     //this function would be called if upload progress done, before postback and server FileUploaded event.
     document.forms[0].disabled=false;
    }
     
    Regards,
    Terry
  •  01-07-2009, 11:25 AM 47519 in reply to 47477

    Re: Help Needed in Placing Uploader in a Update Panel

    hi,
     
    thanks for your reply.
     
    everything is working fine except that during file upload, if i press cascading drop down list on the form it results in postback which cancels the uploading process.
     
    so i need to disable the drop down list during file uploading time only and enable it after file upload is done.
     
    i want to implement the functions like function CuteWebUI_AjaxUploader_OnStart() or function CuteWebUI_AjaxUploader_OnStop() in code behind page.
     
    My Updated code in code behind page is :-
     
    protected override void OnInit(EventArgs e)
    {

    base
    .OnInit(e);
    SampleUtil
    .SetPageCache();
    PersistedFile1.InsertButton.ValidationGroup = "NoNeed";
    PersistedFile1.FileChanged += new PersistedFileEventHandler(PersistedFile_FileUploaded);
    LinkButton1.Click +=
    new EventHandler(LinkButton1_Click);
    }

     
    protected void PersistedFile_FileUploaded(object sender, PersistedFileEventArgs args)
    {
    LinkButton1.Enabled = true;
    }
     
    how and where can i call functions like ( function CuteWebUI_AjaxUploader_OnStart() or function CuteWebUI_AjaxUploader_OnStop()) in my code behind pages.
     
    In simple words, how and where in my code, can i place and call these functions to disable the drop down list on form using
    (dropdownlist1.enabled = false;) during the file upload process only.
     
    Thanks.
  •  01-07-2009, 1:43 PM 47526 in reply to 47519

    Re: Help Needed in Placing Uploader in a Update Panel

    Hi,
     
    You need not call the CuteWebUI_AjaxUploader_OnStart,
     
    the ajax uploader would call it if the javascript function exists.
     
    you just need disable the dropdownlist there.
     
    All these things should be done in client side.
     
    Regards,
    Terry
View as RSS news feed in XML