Inquiring about the status of uploads in the AjaxFileUpload to ensure files have been successfully uploaded

How can I check if the file selected in AjaxFileUpload has already been uploaded or is pending?

For example:

https://i.stack.imgur.com/q6qUQ.png

I want to validate files that are still pending upload. Here is my .aspx page code

<form id="form1" runat="server">
    <asp:ToolkitScriptManager runat="server">
    </asp:ToolkitScriptManager>
    <asp:AjaxFileUpload ID="AjaxFileUpload1" runat="server"
        Width="400px" OnUploadComplete="OnUploadComplete" Mode="Auto" />       
</form>

.aspx.cs code is

 protected void OnUploadComplete(object sender, AjaxControlToolkit.AjaxFileUploadEventArgs e)
{
    string fileName = Path.GetFileName(e.FileName);
    AjaxFileUpload1.SaveAs(Server.MapPath("~/uploads/" + fileName));
}

If I have already uploaded 2 files and then add a new file for upload, how do I verify that the 2 files are uploaded but not the new one. This validation needs to be done using JavaScript

This validation should be triggered by any button's onclientclick event.

Resolved using the following javascript

function validateImageUploaded() {
if ($(".ajax__fileupload_fileItemInfo").length > 0) {
    if ($("div.ajax__fileupload_fileItemInfo").children('div').hasClass("pendingState"))
    {
        alert("found");
        return false;
    }
}
else {
    alert('select your file');
    return false;
}}

Answer №1

To achieve this, utilize .children along with .hasClass

$("section.ajax__fileupload_fileItemInfo").children('section').hasClass("waitingState")

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

A guide on using jCrop to resize images to maintain aspect ratio

Utilizing Jcrop to resize an image with a 1:1 aspect ratio has been mostly successful, but I've encountered issues when the image is wider. In these cases, I'm unable to select the entire image. How can I ensure that I am able to select the whole ...

Experiencing SyntaxError when utilizing rewire and mocha for Node.js testing. Unexpected token encountered

Trying to test a function exported from a nodejs file, I am utilizing q to manage promises. The function returns a promise that is either resolved or rejected internally through a callback. Within this callback, another function from a different location i ...

Tips for incorporating a live URL using Fetch

I'm having some trouble with this code. Taking out the &type = {t} makes it work fine, but adding it causes the fetch to not return any array. let n = 12 let c = 20 let t = 'multiple' let d = 'hard' fetch(`https://opentdb.com/ ...

Methods to modify the state of a Modal component beyond the boundaries of a React class

I am attempting to trigger my modal by modifying the state from outside of the react class. Unfortunately, I have had no success thus far. I have experimented with the following approach: In my code, I have a method named "Portfolio" that is responsible f ...

Adding list items to an unordered list without making them draggable using jQuery

How can I allow users to build a list of sports and drag them into a "cart" using jQuery? The issue I'm facing is that the appended list items are not draggable, and I'm unsure of how to solve this problem. /* JS code for sports.html */ $(fu ...

Angular app encounters issue with Firebase definition post Firebase migration

Hey there, I'm currently facing an issue while trying to fetch data from my Firebase database using Angular. The error message 'firebase is not defined' keeps appearing. var config = { databaseURL: 'https://console.firebase.google. ...

Organizing seating arrangements for a concert hall performance

My goal is to develop a custom concert seat booking system using HTML, CSS, and JavaScript. For example, if the concert venue has 10 rows with 20 seats in each row, I could organize them like this: const rows = [ { name: 'A', seats: [1, 2, 3, ...

Access the video content on Instagram by utilizing the oembed endpoints

THE SCENARIO For the past 9 months, I've had a piece of jQuery ajax code that has been functioning without any issues. However, in the last couple of weeks, it seems to have encountered some problems. This particular code utilizes Instagram's e ...

AngularJS Toggle Directive tutorial: Building a toggle directive in Angular

I'm attempting to achieve a similar effect as demonstrated in this Stack Overflow post, but within the context of AngularJS. The goal is to trigger a 180-degree rotation animation on a button when it's clicked – counterclockwise if active and c ...

Angular 2 module transpilation services

In my angular 2 application, there is a module called common. Here is how the project structure looks like: main --app /common --config //.ts configs for modules --services //angular services --models --store //ngrx store /co ...

Ways to adjust your selection to the space or new line before or after

$('button').on('click', function(){ const selection = window.getSelection(); selection?.modify('move', 'backward', 'word'); selection?.modify('extend', 'forward', 'to the next space ...

bing translator API: the variable text is translated with no content

I'm encountering an issue while working with javascript and PHP. The PHP code seems to run fine until it reaches the $curlResponse variable. From there onwards, all the subsequent variables ($xmlObj, $translatedStr, $translatedText) appear to be empty ...

When trying to upload a file through input using WebDriver, the process gets stuck once the sendKeys

WebElement uploadInput = browser.findElementByXPath("[correct_identifier]"); uploadInput.sendKeys(elementPath); The script successfully initiates the file upload process, however, the custom JavaScript loading screen persists and fails to disappear as exp ...

Retrieve a specific HTML using the returned jQuery AJAX POST request

$('#form-register').change(function() { var i_username = $('input#input-username').val(); var i_password = $('input#input-password').val(); var i_company = $('input#input-company').val(); var i_phone ...

The server remains unreachable despite multiple attempts to send data using Angular's $http

I am encountering an issue with triggering $http.post: app.controller('editPageController', function($scope, $routeParams, $http) { $scope.page = $routeParams.pageid; // retrieve page data from the server $http.get('/pages/&ap ...

Tips for extracting innerHTML or sub-string from all elements that have a specific class name using JavaScript

When it comes to shortening the innerHTML of an element by its Id, I have found success using either slice or substring. While I'm not entirely clear on the differences between the two methods, both accomplish what I need them to do. The code snippet ...

Secure your website with the latest JWT cookie security measures

After storing a JWT with an expiry date set 30 days ahead, the question arises - is it secure to store this JWT in a cookie? The aim is for the token to persist beyond a single session, much like the "Keep me logged in" feature found on some websites. Se ...

Vue should only activate the element that has been clicked on

I'm currently working on my first Vue project and encountering an issue with triggering a child component within a table cell. Whenever I double click a cell, the `updated` event is being triggered in all child components associated with the table cel ...

Tips for invoking a controller method in HTML code

Hello, I am completely new to AngularJS, HTML, JavaScript, and CSS. Please keep your explanations simple for beginners like me. I'm facing an issue where the function "updateFilterTerm" is not being called, causing the variable "filterTerm" to remain ...

Load content within the DIV container

I need help finding code that can use JQuery to load a page into a DIV element. Essentially, I want to load displaycatch.php into a specific DIV <div id="results">Content for id "results" Goes Here</div> Furthermore, I would like to add a ...