Stop duplicate submissions made through ajax requests

I am currently using AJAX to generate a list of replies.

At the end of the reply list, I have included a textarea form that allows users to add their own reply (also using AJAX).

However, I am encountering an issue where I call my JavaScript in my main PHP page, causing the page to not recognize the JS code when a user tries to submit a reply. If I were to add the JS to the AJAX PHP file/page, the code would work but it would then be duplicated multiple times. This duplication would result in the text being submitted multiple times when a user submits the form...

Upon checking my console, I noticed that the JS file duplicates every time I load the replies list.

How can I prevent this issue from occurring?

phpajax

Answer №1

After the user clicks the submit button, prevent them from clicking it again using jQuery:

$("#submit-btn").attr('disabled','disabled');

If an AJAX error occurs, remember to enable the submit button so the user can try submitting the form again with corrected data.

You can do this by removing the disabled attribute:

$('#submit-btn').removeAttr('disabled');

Answer №2

[improved] To avoid repeating data when navigating or pressing F5, it's important to free the $_POST variables after processing them and check if they are not set before redirecting. Here's an example:

/* Do your task with ajax response here */
if(!isset($_post['foo'])) header('Location: wherever.php');
$_POST['foo']=NULL;

If you're using $_GET, consider switching to $_POST as it is more reliable.

Make sure that hitting F5 won't cause form data to be resent. If this occurs, use jQuery to clear your inputs on page load like so:

$('#inputID').val('');

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

Is there a way to load an individual div without refreshing the entire page and display a loading status in the process

Is it possible to load individual Divs separately, without disrupting the current page? Additionally, how can I display a loading status for that specific div using PHP and MySQL or Ajax and SQL technologies? ...

phpmysqlajax

PHP - Modify the final row within a loop

I'm currently working on creating a music playlist based on files in a specific folder. The only problem I'm facing is that the last row in the foreach loop is echoing an extra comma. Here is a snippet of the code: echo '<script type="te ...

phpforeach

Mapping Functions to HTTP Status Codes

I'm just getting started with my ajax-jquery learning journey. How does jquery determine the success or failure of a request? (When is success called versus when is error called?) I have a hunch that it has something to do with the HTTP status code ...

jqueryajaxhttp

javascript / php - modify input fields according to selection change

Can anyone help me with an issue I'm facing? I want to update multiple textfields whenever a new option is selected from my dropdown menu. I've written the following code, but it's not working as expected. Can someone figure out what's ...

phpjavascriptajaxjquery

How can I add content to the body of a modal in Bootstrap 3?

My application has a button that, when clicked, is supposed to trigger a modal popup containing some data. I want the data in the modal to come from another application via a PHP file accessed through a URL. How can this be achieved? <?php echo '& ...

javascriptphpjqueryhtmltwitter-bootstrap

Creating an autocomplete feature with just one input field to display information for two to three additional input fields

I'm working on implementing an autocomplete feature similar to this example: . Feel free to test it out with the code snippets provided: 1000, 1001. I've successfully implemented the autocomplete functionality where typing in Pa suggests Paris. ...

javascriptphpjquerysqlajax

JavaScript functionality can only be restored upon refreshing the page

Lately, I've been delving into ajax requests for my new mobile web application. I am trying to fetch data from a PHP server script using JavaScript functions that should automatically trigger when the user navigates to the page. However, I've enc ...

phpjqueryajax

Looking to design an interactive grid for generating dynamic thumbnails

I am a beginner in the field of web development and I have a desire to create a website for showcasing my portfolio. This website should feature project thumbnails along with brief descriptions, all of which should be displayed dynamically. Although I poss ...

phpjavascriptjqueryhtmlcss

Exploring the power of Django: Leveraging AJAX requests and utilizing path

I am currently exploring ways to pass variables to a specific JavaScript file that initiates an AJAX request within Django. Assume we have a URL with a path parameter linking to a particular view: url(r'^post/(?P<post_id>\d+)/$', Tem ...

pythonjsonajaxdjango

if the arguments for a javascript function are not provided

Currently, I am in the process of learning JavaScript through a book called "Visual Quickstart Guide". However, I have encountered a challenge with understanding the logic behind a particular code snippet. In the function definition below, it appears that ...

javascriptajax

Exclusive to PHP 7.4 - Read-only

I developed a PHP library that utilizes the PHP 8.0 readonly keyword, but now I want to ensure compatibility with earlier versions like 7.4. Although it would be simple to remove the readonly keywords from my code, I believe they serve an important purpos ...

phpreadonlyversion-compatibility

Using the JQuery template with $.get function does not produce the desired result

Working on populating a table using a Jquery Template can be tricky. One challenge is incorporating a json file via an ajax call for the population process. $(document).ready(function() { var clientData; $.get("/webpro/webcad/lngetusuario", funct ...

javascriptjqueryjsonajax

In PHP, when passing a parameter by reference and then assigning it to NULL, the reference is

While working with passing parameters by reference to an object method, I noticed a peculiar behavior: class Test { private $value; public function Set($value) { $this->value = $value; } public function Get(&$ref) { ...

phpreference

Extracting the location information from the Google Calendar API

I need assistance extracting the where attribute from an Event using the Zend GData Framework in php. Can anyone provide guidance on the correct format to retrieve that attribute? $eventFeed = $gdataCal->getCalendarEventFeed($query); foreach ($eventF ...

phpzend-frameworkgoogle-calendar-api

Steps for performing a 'back' action within a div element using jQuery

Within my HTML, I have a div element containing a link. When the user clicks this link, I use AJAX to load new content into the div area. This new content includes a 'back' link that, when clicked, should revert back to the previous content. Cur ...

jqueryhtmlajax

Utilizing jQuery AJAX with the data type set as HTML

Hello, I have encountered an issue while using jQuery Ajax function with PHP. The problem lies in the fact that when setting the datatype to "html", my PHP variables are not being returned correctly. JavaScript $.ajax({ type: "POST", dataType: "html", ur ...

phpjqueryajax

Using two fields to create a dependent dropdown list in Django with Ajax

I am currently developing an application to input locations for a specific purpose. Here are my models: class City(models.Model): city = models.CharField(max_length=40) class Area(models.Model): city = models.ForeignKey(City, on_delete=models.PROT ...

djangoajax

Securing Confidential Images in Symfony2

Currently facing an issue with my Symfony setup. Users in my app can upload images to the server, which are stored in /web/uploads/images directory. My goal is to make these images visible only to logged-in users. I've attempted to tweak the security ...

phpsecuritysymfony

If the input value is a numeric number, show the image; if the input value is not a number, display text; if the input value is 0, show

Trying to modify a segment of PHP code has been quite challenging. The goal is to show an image if the input value is a number (such as 1, 3, 20, 99), display text if it's a string (like lorem, randomtext), and show nothing if the value is 0. Despit ...

phpinputuser-input

Using AJAX to submit a single form

Within my HTML view, I have multiple forms that are displayed using a PHP foreach loop. One of the form examples is as follows: <form method="POST" class="like-form-js"> <input type="hidden" name="post_id" value="<?= $post['i ...

javascriptphpjqueryhtmlajax