Is it possible to display a upload progress indicator without using a specialized ajax uploader

I'm working on a Rails application that uploads large files (~300mb). Is there a way to incorporate a progress indicator without relying on a specific HTML5 uploader or installing the nginx server module? Can this be achieved simply with the standard file upload field?

Thanks in advance!

Answer №1

My knowledge is limited to JS/AJAX, where the DOM gets refreshed upon a successful upload callback.

Another option is exploring the configuration of express/Node.js for handling streamed uploads and utilizing AJAX to update the DOM (in this scenario, your Node.js service would operate separately from Rails - communication with it would be done through JSON).

Answer №2

In the case of utilizing pure AJAX, I recommend implementing a dedicated call to retrieve the current upload status (/upload/status/upload_id). You can set up a timer to check progress every 2 seconds, for example.

Within your server-side setup, consider having a separate thread responsible for overseeing the upload process and providing updates on its progress.

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

receiving an object as the return value in AngularJS

To access locfrnd in the code snippet below, follow these steps: I have created an Array named PlaceCollection containing 2 elements. place locfrnd, which is an array While I was able to successfully access place, I encountered an error when trying to a ...

How can contextual binding be implemented in TypeScript?

In Laravel, you have the option to specify which class should be imported if a particular class is accessed. For example, if someone tries to use the Filesystem contract, it will return the Storage Facade (Laravel Contextual Binding). Similarly, if someo ...

Using the -g flag in Node.js consistently results in error messages

Whenever I attempt to install something globally with node, I encounter a series of errors. Interestingly, when I tried it in Powershell, no errors were thrown, but I suspect this is due to the fact that I was using Powershell instead of the official Node ...

Retrieve the list of device tokens for the APNS service

Is it possible to retrieve a list of all device tokens on which my app is installed through an APNS endpoint? I am aware of the feedback service that provides the status of devices to whom messages are sent, but I believe this is only after the message ...

What is the best way to switch between components when clicking on them? (The component displayed should update to the most recently clicked one

I am facing a challenge in rendering different components based on the navbar text that is clicked. Each onclick event should trigger the display of a specific component, replacing the current one. I have 5 elements with onclick events and would like to re ...

How can I use Express JS and Mongoose to update an array of objects in MongoDB?

Encountered a TypeError: result.taskList[id].push is not a function const taskcancel = (user, pswd, id) => { return db.Todotasks.findOne({ username: user, password: pswd }).then((result) => { if (result) { console.log(result.tas ...

Implement a Threejs labeling method using JavaScript

My knowledge of JS is limited, but I am eager to use JS functions to create labels for Three.js functions. Check out the Demo Link It seems like I'm struggling to create individual labels for each vertex in this scenario. Why does it only generate o ...

Populate an HTML layout with MySQL information and dynamically add the content to the page using JavaScript

I'm facing a challenge with creating an about us page for a website. I am using a template to structure the page and I want to populate it with MySQL data. I have enclosed the entire <div> of the personcard within a <script> tag, but the p ...

Include a JSON attribute containing the URL of a specific object found within the response data

I am currently working on an API project (without the use of any gems) and I am hoping to enhance the responses it provides. Specifically, When the API consumer requests a list of objects: the API will reply with a list of objects displaying only sele ...

Combining ng-filter and ng-repeat to iterate over key-value pairs in objects

Currently, I am utilizing the built-in Angular 1 filters in an attempt to filter out a property of an object. While Angular Filters typically only accept Arrays and not Objects, the structure of the web application prevents me from refactoring to pass an a ...

Pass data from a JavaScript function to Objective-C in Xcode by returning an array

How can I retrieve an array of strings from Javascript in my iPhone app code? I am calling a Javascript function, and once it completes, I need to send the array of strings back to the Objective-C code. What is the best way to return the array and how can ...

Tips for setting up Reaction Roles in discord.js?

Having some trouble implementing this functionality, especially with my reaction role. Wondering if I am using the correct functions/methods. Any help would be greatly appreciated. New to discord bot development and might have a simple question, but any a ...

Exploring Javascript: Understanding the Contrast Between Function and Class

In June 2015, with the introduction of ECMAScript 6, a new syntax for Javascript classes was unveiled. The new syntax is exemplified by the following code snippet: class Polygon { constructor(width, height) { this.width = width; thi ...

Error: The sort method cannot be applied to oResults as it is not a

I encountered this issue. $.ajax({ url: '${searchPatientFileURL}', data: data, success: function(oResults) { console.log("Results:...->"+oResults); oResults.sort(function ...

Having trouble getting JQuery Ajax POST to work in Codeigniter

Encountering an issue with jQuery AJAX post in CodeIgniter, where clicking the submit button triggers an error. Below is the code snippet: home.js form.on('submit', function(e){ e.preventDefault(); var fields = {}; form.find(' ...

When the class changes, V-for re-renders every component

Currently, I am in the process of changing classes for images based on their index using the moveIndex method and key events. While this works smoothly on computers, it seems to take significantly longer when implemented on TVs. The process runs smoothly w ...

ReactJS issue: I am unable to display the dropdown menu while looping through an array

Although the title may be confusing, I am facing an issue in my Laravel project that integrates ReactJS on the front end. I am attempting to create a dropdown menu for users to select the status of a project. The statuses and their IDs are retrieved from a ...

Tips for extracting information from a JSON file using $routeParams in AngularJS

https://i.stack.imgur.com/NQCpy.png I am currently encountering an issue with retrieving data using $routeparams. Here is a description of my problem: Retrieving the URL to redirect console.log($routeParams); console.log($routeParams.json_url); $.getJS ...

The method of reading a unique array of objects for each radio button

Currently, I am facing an issue when trying to retrieve unique elements for each radio button from the database. The data structure and information obtained from the database are as follows: { FormularID: 182, CampaignID: 14, FormLabel: & ...

Hovering over the child element, instead of the parent

I'm working on implementing a highlight feature for my website. The structure of the HTML looks something like this: <div> <!-- this is the main container --> <div> content ... </div><!-- a child element --> < ...