skip to Main Content

Please know that I’m a complete noob without any kind of web dev experience. This also seems like something that would be wanted pretty frequently, so I very well might be missing something simple in my too-many hours of Googling.

I have a web form with some text boxes for user info and an AjaxFileUpload control. I want to check that a TextBox is filled in when the "Upload" button in the AdjaxFileUpload control is hit.

I’m successfully using the OnClientUploadCompleteAll of the upload control and a Java function that triggers and a hidden button to do some things after the upload.

I was hoping to use the OnClientUploadStart to do something similar for checking the TextBox. The commented code below are things I’ve tried after searching around for things, but with no joy. I’m also thinking there may not be a way to do this because when the JSUpldStart function fires the "Upload" button has already turned into a "Cancel" button in the upload control.

I’ve tried playing with some asp.net validation things but couldn’t make those work. Again, noob, was probably missing something as I only had validation happening AFTER the upload and it was cancelling the post upload code that had been working. :o/

Thanks for reading.

<ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" 
    OnUploadComplete="AjaxFileUpload1_UploadComplete"
    OnClientUploadCompleteAll="JSUpldDoneAll"
    OnClientUploadStart="JSUpldStart"
    Width="50%" />

function JSUpldStart(sender, args) {
    /*alert("JSUPldStart")*/
    if (TxtUplBy.value == "") {
        alert("It's blank.")
        /*args.cancel(true);    Cancel is not a function*/
        //throw ("Please fill in name.");
        //return false;
        //args.set_cancel(True);        Error: True is not defined
        //args.set_cancel(true);        Error: set_cancel is not a function
        //args.set_cancel=true          Did absolutely nothing.
    }
}

2

Answers


  1. Try with JavaScript function OnClientUploadComplete.

    Below is the function call and function implementation.

    function validateTextBox() {
        var textBoxValue = document.getElementById('<%= TxtUplBy.ClientID %>').value;
        if (textBoxValue == "") {
            alert("It's blank.");
            return false;
        }
        return true;
    }
    <ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload1" runat="server" 
        OnClientUploadComplete="validateTextBox" />
    Login or Signup to reply.
  2. Perhaps you can try setting the enabled property of the button to False until the text box’s .text property is not empty, so for example I have these asp.net text box and button

    <div>
     <asp:TextBox runat="server" AutoPostBack="True" id="tbRequired" OnTextChanged="Upload_Check"/>
     <asp:Button runat="server" id="Upload" text="Upload"/>
    </div>
    

    And then in the back I have:

    Protected Sub OnLoad(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Load
        If Not IsPostBack Then
            Upload.Enabled = False
    End Sub
    
    Protected Sub Upload_Check(ByVal sender As Object, ByVal e As System.EventArgs) 
        If tbRequired.Text <> "" Then
            Upload.Enabled = True
        else
            Upload.Enabled = False
        End IF
    End Sub
    

    The first method will run when the text within the textbox is changed and will check to see if the textbox has been populated, if it has it will enable the button to be able to be pressed, and if it is still empty the button will remain unclickable

    The second method is run within a standard page_load method which runs at the first load of the webpage.

    It looks like this when there is no text entered
    No Text

    And when it has text
    With Text

    Sorry the code is in VB but JS also supports the .Enabled property

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search