Upload Files Button: General Information

The upload files button control provides users with the ability to upload any number of files to a record. This control functions as both a button you can click and an area where files can be dropped. A user can upload the files either by dragging them onto the button or via the [1]janice.paganiniAre you talking here about the standard file upload dialog box in the system? ick_jcg_32c2025/02/0921:40:33-05:00Mehran QadriYes, the default Windows one.1ick_jcg_32c12025/02/1014:51:03-05:00file upload dialog box, which opens when the button is clicked.

The following screenshot shows an example of the upload files button control in the Files dialog box. This dialog box opens when a user clicks Files on the form title bar of a form.[2]janice.paganini- I'm not sure if "the button" or "the control" is better in this sentence. - I added this because screenshot captions should not introduce information that was not already covered in the text, and we had not mentioned the button/control name in the text. You might be able to think of a better way to do this, though. I used this wording to subtly (maybe too subtly) indicate that you can assign it any name, although I don't know if that is true. Maybe we should indicate this, one way or the other.2025/02/1011:22:23-05:00 In this example, the control is assigned the Upload Files name.

Figure 1. The Upload Files button in the Files dialog box


An upload files button control is defined by PXFileUploader in the Classic UI. In the Modern UI, an upload files button control is defined by the qp-multi-upload tag.

Learning Objectives

In this chapter, you will learn the following about an upload files button control:

  • The proper configuration of the control
  • How to convert the ASPX elements of this control to HTML or TypeScript

Applicable Scenarios

You configure the upload files button control when you want to give users the ability to upload any number of files to a record.

Configuration of an Upload Files Button

You configure the upload files button control in HTML by using the qp-multi-upload tag.

The configuration properties of the qp-multi-upload control are stored in the IMultiUploaderConfig interface.

The following code shows an example of defining an upload files button control in HTML.

<qp-multi-upload
   config.bind="{
        id: 'uploadFilesControl',
        graph: 'MyPhotoLogEntry',
        view: 'Photos',
        action: 'UploadFiles',
        dropTarget: '#gridPhotos',
        autoRepaint: true,
   }"></qp-multi-upload>