1. Home
  2. Forum
  3. ASP.NET Web Forms
  4. Uploadbox - Unable to get property 'dropAreatext of undefined or null reference

Uploadbox - Unable to get property 'dropAreatext of undefined or null reference

Can you tell me what im doing wrong? If I set AllowDragAndDrop="true" i get this error. Otherwise no error.

6 Replies
MK Muthukrishnan Kandasamy Syncfusion Team March 26, 2020 05:19 AM UTC

Hi Roy, 
 
Thanks for contacting Syncfusion support. 
 
Your reported problem arises when we have not added DropAreaText for UploadBox control. If you haven’t added any locale for UploadBox control then it takes your system culture as locale value and it’s a default behavior of the component, if you don’t want to use the localization text for UploadBox based on the system culture then you can set locale as en-US culture while defining the control properties. By doing so, UploadBox will always render based (en-US) culture. Refer the below code block. 
 
 
<ej:UploadBox ID="UploadACESFile" runat="server"  Locale="en-US" AllowDragAndDrop="true" SaveUrl="/SaveFile.ashx"  DropAreaText="Drop zip files to upload or click"></ej:UploadBox> 
 
 
Please refer to the below forum the similar problem is discussed. 
 
 
Please let us know, if you need any assistance. 
 
Regards, 
Muthukrishnan K 


RA roy almon March 27, 2020 12:07 AM UTC

Thanks for your continued help.

The issue still persists.  

I've done the following;
> Using vs2019 (net 4.7.2) I created a fresh test web application and downloaded the latest version of syncfusion.aspnet using nuget
> I created the page shown below with the sample code you provided.

any further suggestions would be appreciated


KR Keerthana Rajendran Syncfusion Team March 27, 2020 10:59 AM UTC

Hi Roy, 

Sorry for the inconvenience.  

Based on the error we suspect that locale property is added for ejUploadbox and corresponding text is not defined in sample. So if you have set locale property , add corresponding text as done in the below document. 
 
 
If you have not set locale property in sample level, this may be added from your machine. Please ensure once whether “locale” exists anywhere in your page as shown below 
 
 
Locale property may be added from the system region settings as shown in the below image.  
 
 
 
Please ensure this in your machine. If you doesn’t require this locale kindly change this format settings to the required language as shown below 
 
 
 
 
By default, Syncfusion controls will be rendered with default English (en-US) culture. If you are setting any culture other than this, kindly add the corresponding locale text value through script section . 
 
Please let us know if you need further assistance on this.  
 
Regards, 
Keerthana.   


RA roy almon March 27, 2020 05:01 PM UTC

Thank you for your continued help

The images below represent the change i made to the language settings on the development machine. The AFTER scenario
solved the problem.

>Im confused about your solution to this issue however. In the first reply you told me that i needed to specify locale to solve the issue.
then in your second reply you told me that specifying local was actually the cause of the problem. Can you please review the thread
and explain.  My feeling is that I should not have to specify locale at all.

> Will the language specification in settings on the deployment machine be a configuration requirement for me to use the file upload control?

> Before I made this change I downloaded the sample files from 142010 and it worked as expected. Why did I not need to make this
language change for that use of the upload control to work? Is specifying locale an override of something which was addressed in 142010
by specifying language inputs as they did in their original question's sample?




MK Muthukrishnan Kandasamy Syncfusion Team March 30, 2020 07:56 AM UTC

Hi Roy, 
 
We are glad to know that your reported problem solved in UploadBox control. 
 
Your machine is initially configured with default culture as en-CA. So, the reported issue could have occured when you to render UploadBox (its default culture is en-US) in application. After then, you have added system culture as en-US, which matches the default culture of UploadBox, so it could have resolved your reported issue. 
 
In our initial update, we have suspected that you have used UploadBox control in your machine without specifying the locale property and corresponding text for DropAreaText property. So that we have suggested to use the locale and DropAreaText in your sample. 
 
We would like to let you know that the UploadBox control renders based on the hosted machine culture. For example, your system culture or locale property of UploadBox was en-US, but you are opening the hosted link in another client machine with culture en-CA, then it will not affect the UploadBox functionality and en-US will remain as locale for UploadBox control.  
 
If you are machine is configured with any culture other than en-US, please add its corresponding locale text value through script section as like below. 
 
<script type="text/javascript"> 
        ej.Uploadbox.Locale["en-CA"] = { 
            buttonText: { 
                upload: "Upload", 
                browse: "Browse", 
                cancel: "Cancel", 
                close: "Close" 
            }, 
            dialogText: { 
                title: "Upload Box", 
                name: "Name", 
               size: "Size", 
                status: "Status" 
            }, 
            dropAreaText: "Drop files or click to upload", 
            filedetail: "The selected file size is too large. Please select a file within the valid size.", 
            denyError: "Files with #Extension extensions are not allowed.", 
            allowError: "Only files with #Extension extensions are allowed.", 
            cancelToolTip: "Cancel", 
            removeToolTip: "Remove", 
            retryToolTip: "Retry", 
            completedToolTip: "Completed", 
            failedToolTip: "Failed", 
            closeToolTip: "Close" 
        }; 
    </script> 
 
 
Please let us know, if you need any assistance. 
 
Regards, 
Muthukrishnan K 


WI williamholding September 13, 2021 05:37 AM UTC

This issue arises when js/jquery is not able to refer to the element. It is because at the time of rendering the page(view), object is null or undefined - which means that there is no instance of a class in the variable. If you are getting data for object from an async call(api's), these kind of problems will arise. So you should always check the object whether it is null or undefined then if it is not, you can access its properties.

The standard way to catch null and undefined simultaneously is this:


if (variable == null) {

// your code here.

}


Because null == undefined is true, the above code will catch both null and undefined.

Also you can write equivalent to more explicit but less concise:


if (variable === undefined variable === null) {

// your code here.

}

This should work for any variable that is either undeclared or declared and explicitly set to null or undefined.

In most cases this error is related to getElementById(). So getting a value from an input could look like this:


var value = document.getElementById("frm_new_user_request").value


Also you can use some JavaScript framework, e.g. jQuery, which simplifies operations with DOM (Document Object Model) and also hides differences between various browsers from you.

Getting a value from an input using jQuery would look like this:


input with ID "element": var value = $("#element).value

input with class "element": var value = $(".element).value




Loader.
Up arrow icon