This is a migrated thread and some comments may be shown as answers.

RadAsyncUpload in Grid submit buttons on the page are disabled?

7 Answers 211 Views
Grid
This is a migrated thread and some comments may be shown as answers.
moegal
Top achievements
Rank 1
moegal asked on 13 Mar 2014, 09:25 PM
RadAsyncUpload in Grid

I noticed this on the Upload example:

"You need to ensure that any submit buttons on the page are disabled while upload is in progress. Otherwise, there is no guarantee that the files will be uploaded successfully"

How would I do that?

Marty

7 Answers, 1 is accepted

Sort by
0
Kostadin
Telerik team
answered on 18 Mar 2014, 12:39 PM
Hi Marty,

A possible solution is to find the buttons on the page by using a JavaScript and set their disabled attributes to false. Please check out the following code snippet.
document.getElementById("btnPlaceOrder").disabled = true;

Regards,
Kostadin
Telerik
 

DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

 
0
moegal
Top achievements
Rank 1
answered on 18 Mar 2014, 03:13 PM
Kostadin,

I know how to disable a button?? What I would like to know is how to disable a button until an image is selected and uploaded via the async uploader.

Seems the example code for upload in a grid is not complete. Surely you would have a way of doing what you recommend by saying "You need to ensure that any submit buttons on the page are disabled while upload is in progress. Otherwise, there is no guarantee that the files will be uploaded successfully".

Thanks, Marty
0
Kostadin
Telerik team
answered on 21 Mar 2014, 12:21 PM
Hello Marty,

A possible solution is to disable the buttons on OnClientFileUploading event handler and enable them back OnClientFileUploaded. Please check out the aforementioned help articles for additional information.

Regards,
Kostadin
Telerik
 

Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

 
0
moegal
Top achievements
Rank 1
answered on 21 Mar 2014, 09:42 PM
How do I find a reference to the update and cancel button in the EditColumn via JavaScript so I can disable/enable?

<EditFormSettings>                           
                            <EditColumn ButtonType="PushButton" CancelText="Cancel" UpdateText="Update">                               
                            </EditColumn>
                        </EditFormSettings>
0
moegal
Top achievements
Rank 1
answered on 24 Mar 2014, 12:19 PM
function OnClientFileUploading(sender, eventArgs) {
                            var update = ($("input[id$='UpdateButton']").length) ? $("input[id$='UpdateButton']").prop('disabled', true) : '';
                            var insert = ($("input[id$='PerformInsertButton']").length) ? $("input[id$='PerformInsertButton']").prop('disabled', true) : '';
 
                        };
                        function OnClientFilesUploaded(sender, eventArgs) {
                            var update = ($("input[id$='UpdateButton']").length) ? $("input[id$='UpdateButton']").prop('disabled', false) : '';
                            var insert = ($("input[id$='PerformInsertButton']").length) ? $("input[id$='PerformInsertButton']").prop('disabled', false) : '';
                        };


here is what I did. I am sure there must be a better way to identify the buttons than this? I've used the jquery selector ends with to find the buttons.

Marty

Marty
0
Accepted
Kostadin
Telerik team
answered on 26 Mar 2014, 02:07 PM
Hi Marty,

You could use the following approach to disable/enable the update and cancel buttons.
function OnClientFileUploaded(sender, eventArgs) {
    var cancelButton = $telerik.findElement(sender.get_parent().get_editItems()[0].get_editFormItem(), "CancelButton");
    var updateButton = $telerik.findElement(sender.get_parent().get_editItems()[0].get_editFormItem(), "UpdateButton");
    cancelButton.disabled = false;
    updateButton.disabled = false;
}
 
function OnClientFileUploading(sender, eventArgs)
{
    var cancelButton = $telerik.findElement(sender.get_parent().get_editItems()[0].get_editFormItem(), "CancelButton");
    var updateButton = $telerik.findElement(sender.get_parent().get_editItems()[0].get_editFormItem(), "UpdateButton");
    cancelButton.disabled = true;
    updateButton.disabled = true;
}


Regards,
Kostadin
Telerik
 

Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

 
0
moegal
Top achievements
Rank 1
answered on 26 Mar 2014, 02:40 PM
great! Thanks.

Marty
Tags
Grid
Asked by
moegal
Top achievements
Rank 1
Answers by
Kostadin
Telerik team
moegal
Top achievements
Rank 1
Share this question
or