Utilizing AJAX to efficiently delete numerous server files with multiple form inputs

I'm facing an issue with a form that has multiple text boxes containing ids. The problem arises when the user leaves the page, triggering a Python script (delete.py) to delete files on the server. Each file's name includes the corresponding id, so it needs to be passed to the script. Oddly enough, when there is only one id in the form, everything works smoothly and the file gets deleted correctly. However, if there are multiple id fields, none of the files get deleted.

Strangely, when using Firebug to debug the code, the files do get deleted regardless of the number of id fields in the form. I'm puzzled by this behavior and would appreciate any guidance or help to understand what's causing this inconsistency. Below is the onbeforeunload method I have implemented:

function deleteFiles()
{
  var xmlhttp;

  if (window.XMLHttpRequest)
  {
    xmlhttp = new XMLHttpRequest();
  }
  else
  {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }  

  allElements = document.getElementsByName("id");
  for (x=0; x < allElements.length; x++)
  {
    xmlhttp.open("GET", "/cgi-bin/delete.py?id=" + allElements[x].value, true);
    xmlhttp.send();
  }  
}

window.onbeforeunload = deleteFiles;

Answer №1

Seems like the issue may be with the requests being sent at a rapid pace. Trying adding
xmlhttp.async = false;

function removeRecords()
  {
  var xmlhttp;

  if (window.XMLHttpRequest)
  {
    xmlhttp=new XMLHttpRequest();

  }
  else
  {
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }  

  allElements = document.getElementsByName("id");

  xmlhttp.async = false;

  for (x=0; x < allElements.length; x++)
  {
    xmlhttp.open("GET","/cgi-bin/delete.py?id=" + allElements[x].value,true);

    xmlhttp.send();
   }  

window.onbeforeunload = removeRecords;

Please share any insights you have

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

Using an arbitrary object as an argument in a CoffeeScript anonymous function

When I execute the below Coffeescript code: @total = (a, b) -> a + b The resulting compiled Javascript is: (function() { this.total = function(a, b) { return a + b; }; }).call(this); Is there a method in Coffeescript to substitute ...

What is the best way to search for items using only a portion of a phone number or typing a name in any case (uppercase, lowercase) and still get accurate results?

let contacts = [ { name: 'John', phone: 987654 }, { name: 'Sara', phone: 654321 } ] I am developing a contact manager app with various functions to manage contacts. Add new contac ...

Generating an Xpath for the selected element with the help of Javascript or Jquery - here's how!

On my website, I have implemented a click event on an element. When a user clicks on this element, I want to generate the XPath of that particular element starting from either the html or body tag, also known as the Absolute Xpath. For example, if I click ...

Enhance the material-table component by incorporating dynamic information into the lookup property

I am currently facing challenges while attempting to dynamically add data to the lookup property in the Material-Table component. The lookup is structured as an object, and you can refer to its definition in the initial example provided here. However, it ...

Server request successful, but CORS error occurs in browser

When I make an HTTP POST request to the Microsoft login in order to obtain an access token for use with the mail API, the request is successful but my code still goes to the error clause. requestAccessToken(code: string) { console.log("Requesting access t ...

Iterating over the AJAX response data using the $.each method

I am looking to make a request using AJAX, and I will receive plain HTML in return. The HTML I receive will look something like this: <div> abc </div> <div> def </div> My goal is to iterate through the HTML elements using $.each w ...

Can someone guide me on integrating Apache Superset as an application within a Django project?

What is the best way to integrate Apache Superset into my Django project as an app? I attempted to install Apache Superset using Docker, but now I am looking to fully incorporate the Superset tool into my Django project as one of the applications. ...

Using Node.js to manipulate an existing Div element on an HTML page

As I was browsing for a solution to my node.js issue, I stumbled upon a question that has already been answered here: Node.js send HTML as response to client However, the answer did not quite solve my problem. My scenario involves having a form on the se ...

Effect of Module vs. Classes on Node.js Performance

I have two different approaches to fetching data and I am looking for guidance on which one is more efficient. Below are the two sets of code: //dataService.js module.exports = { getData: function(){// return data from some sync source} } const DataServ ...

JQuery is not able to render Hindi content properly

I am attempting to showcase some Hindi words using JQuery because these are essential contents that need to be displayed on every page of the website. Please note that this is a static website built with HTML and JQuery/JavaScript. Below is my JS file: in ...

Using $npm_package_ notation to retrieve information about the version of a private package

When using Npm, you can easily access package information from the package.json file by using a helpful prefix. For example, you can extract the react version with $npm_package_dependencies_react to find the current version of react listed in the file. Ho ...

Does Three.js lighting adjust according to the bundler used?

Today, I decided to streamline my portfolio project by transitioning it from standard HTML to the Vite bundler for easier dependency management. I simply copied and pasted the existing code, making adjustments to the imports since I had been using relative ...

Bespoke HTML, CSS, JavaScript, and PHP website designs within the Wordpress platform

I am a beginner in the world of Wordpress, coming from a background of creating websites from scratch. Currently, I am working on a Wordpress template (Astra) and looking to create a custom page using HTML, CSS, JavaScript, and PHP from the ground up to ad ...

JavaScript - turn off online connectivity

Is there a way to test my website for offline use by disabling connectivity on the bootstrap before anything loads, so that all data will be loaded from cache? I have tried various offline libraries such as this one, but I haven't found a way to prog ...

Implementing a CSS stylesheet that is triggered when the user reaches the top of the webpage, and incorporating an

Currently, I have code that controls the hiding and showing of my navigation menu when a user scrolls up on the page. $.fn.moveIt = function(){ var $window = $(window); var instances = []; $(this).each(function(){ instances.push(new moveItItem($( ...

"Converting an image in Byte[] format to a Base64 string in JavaScript: A step-by-step

Can anyone help me figure out how to convert an image from an SQL database into a Base64 string? The image is currently in the format {byte[6317]}. ...

Combining JSON objects in Node.js

I am extracting data from my database and converting it to JSON format. However, I now want to merge all the JSON data into a single JSON object. I have attempted various methods, but due to my limited knowledge of JavaScript syntax, I have not been able ...

Angular9: construction involves an additional compilation process

After updating my Angular8 project to Angular9, I noticed a new step in the build process which involves compiling to esm. This additional step has added approximately 1 minute to my build time. A snippet of what this step looks like: Compiling @angular/ ...

Ajax not detected

My code is currently experiencing an issue where Ajax is not being recognized, even though other jQuery methods and selectors are functioning correctly. new Ajax.Request(form.action,{ method: 'POST', postBody: params, onSuccess ...

Having trouble with a malfunctioning part of the API in my NodeJS code. Any suggestions on how to resolve the issue

I'm currently working on developing a REST API in NodeJS for an online store. Here's a snippet of my code for handling POST requests: router.post('/', (req, res, next) => { const order = new Order({ _id: new mongoose.Typ ...