"The maximum amount of data that you can upload is NaN undefined" error is coming on uploading an image using "Upload Media" button in Sitecore

Question

I am trying to upload media using below procedure:

1. Click on "Browse" of Image field in a sitecore item.
2. Click on "Upload Media" button.
3. Click on "Browse for Media files" and upload a new image.

By following the above procedure, I am getting this error message:

The maximum amount of data that you can upload is NaN undefined.

Hence the image doesn't upload. However I am able to upload image in Media Library and then after linking the same to the item but when trying to upload media directly from content item, I am getting the error.

How to solve this problem?

PFB Form tag statement

<form data-sc-id="Uploader" data-sc-databasename="master" data-sc-maxrequestlength="-1024" data-sc-executiontimeout="600" data-sc-destinationurl="/sitecore/media 

library/Images/Social/Connector/download" data-sc-filesizeexceededtext="The maximum amount of data that you can upload is" data-sc-timeoutext="The media files could 

not be uploaded. Please try again." class="sc-uploader row sc_Uploader_42 data-sc-registered" data-sc-require="/-/speak/v1/business/uploader.js" method="POST" 

enctype="multipart/form-data">
  <img class="sc-uploader-preview hide">
  <div class="sc-uploader-content">
    <span class="drag">
      Drag and drop files here
      <br>
      or
      <br>
    </span>
    <a href="#" class="btn btn-default sc-button sc_Button_14 data-sc-registered">
      Browse for media files
      <input class="sc-uploader-fileupload" type="file" name="files[]" multiple="" data-url="/api/sitecore/Media/Upload?

database=master&amp;destinationUrl=/sitecore/media library/Images/Social/Connector/download">
    </a>
    <div class="sc-uploader-general-info">
      <div class="sc-uploader-general-info-progressbar progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" 

style="display: none;">
        <div class="bar data-sc-registered" data-bind="style: { width: globalPercentage() + '%' }" style="width: 0%;"></div>
      </div>
      <div class="sc-uploader-general-info-data" style="display: block;">
        <div class="sc-uploader-general-info-data-col col1">
          <div class="sc-uploader-general-info-data-uploadingData" style="display: none;"><span data-bind="text: uploadedSize" class="data-sc-

registered">0</span>&nbsp;of&nbsp;</div><span data-bind="  text: totalSize" class="data-sc-registered">11.2 Kb</span>
        </div>
        <div class="sc-uploader-general-info-data-col col2">|</div>
        <div class="sc-uploader-general-info-data-col col3">
          <div class="sc-uploader-general-info-data-uploadingData" style="display: none;">
            <span data-bind="  text: uploadedFiles" class="data-sc-registered">0</span> &nbsp;of&nbsp;
          </div>
          <span data-bind="  text: totalFiles" class="data-sc-registered">1</span>&nbsp;<span data-bind="  visible: totalFiles() > 1" class="data-sc-registered" 

style="display: none;">Files</span>
          <span data-bind="  visible: totalFiles() === 1" class="data-sc-registered">File</span>
        </div>
      </div>
    </div>
  </div>
</form>

Answer 1

You need to check if you have set the maxRequestLength from the web.config or you can update it from the IIS.

Web.config Way

Navigate to the path: system.web/httpRuntime and check if you have an entry for httpRuntime. If not, you need to specify one as follows:

<httpRuntime maxRequestLength="512000" executionTimeout="3600" enableKernelOutputCache="false" relaxedUrlToFileSystemMapping="true" requestValidationMode="4.0" enableVersionHeader="false" />

Note that the length is in kilobytes

IIS Way

1. Open IIS
2. Click on the site you want to accept larger file sizes
3. In the main window double click ‘Request Filtering’
4. On the top tab right click to see options and select ‘Edit Feature Settings’
5. Now change the number in the field ‘Maximum allowed content length (bytes)’

If it is present, you may need to increase the length.

UPDATE

As you can see, the attribute data-sc-maxrequestlength="-1024" has a negative value and this is why the above error occurred. So, the issue is with the maxrequestlength.