Unable to Reset Verified ReCapcha - javascript

I am using ReCaptcha 2 on a webpage. The user enters the username and password and is validated through an Ajax call. (Of course, the user will need to verify ReCaptcha before clicking the submit button). If the validation fails, I want to give another chance to resubmit data. However, the ReCaptcha validation fails with 'duplcate submission error' It seems that a validated ReCaptcha cannot be submitted again. So my question is -- how can I reset a verified ReCaptcha so that the user could reverify it? I am using JavaScript, jQuery and Vue.js

Use the reset() method, e.g
grecaptcha.reset();

Related

Prevent browser from storing password if signup failed

I have a sign up form with email and password/repeat-password fields, using Bootstrap 4 and jQuery. These get submitted to my API using jQuery $.post().
The issue is that even if the signup fails - for example if the email already exists - Chrome offers to save the password. This is annoying.
How can I prevent Chrome from doing so only if the signup fails, but not if it succeeds?
When searching I've only found questions and answers about how to completely disable the feature - but I want it to be disabled only if the POST failed, not if it was successful. Also, I do not wish to disable the password autocomplete feature.

When I perform the ajax request that performs sign up or login it doesn't work properly

I am trying to make a sign up and login forms in a project that follows MVC pattern. So we can divide the process into 3 parts: 1- the front-end which is html,css and javascript. 2-Server-side which is PHP 3- database which is MySQL. The problem I have is that when I submit the form either Login or sign up I get a strange behavior that depend on the values i'm sending to the PHP code.
for the sign up process. when I submit the email and password the ajax request send successfully the data and the username and password are correctly inserted into the database, but the on success function is not called. and the page is refreshed.
for the login processes. consider we have an already existing user in database 'user1#gmail.com' and password '1234'. if I entered the correct username and password I get the same behavior as the signup the page is refreshed and on success function is not called and the correct behavior that should happen based on the following codes that it should overwrite the page with the response, but if I send the correct username and password field is empty the onsuccess function is called and write in the document the response 'Hello from login wrong'. In the codes I wrote document.write() function to show only the response but it's not for the real implementation.
There are multiple ways to stop your form from submitting during ajax processing, one easy solution is to change your submit button to a button.
You do this by changing:
type="submit"
to
type="button"

Preventing Duplicate Form Submissions Without JS

I am working on a project and i am building it using the mvc pattern. On successful form submission i redirect user and display a flash message ( success message using session ) i have no issues with users using the back button or refreshing. But if a user encounters an error when submitting a form the form is not redirected so the error can be displayed while keeping old form data to populate the field so users do not have to re-enter information.
The issue i am having is when users will spam the button for any reason. If i double click or spam the button an error is produced ( invalid form token error ) but the db interaction still takes place and inserts the form data. I am trying to find the best js alternative to maintain cross browser compatibility. Is js the way to go? Is their a php alternative?
As you are using session vars, why not set a variable just after your DB update takes place. Then before every DB update check for this value. If false then update DB.
function updateDB(){
if($_SESSION['already_submitted'] == true) return false;
// DB update code
// on success
$_SESSION['already_submitted'] = true
// rest of code
}

How to let browser prompt save password when using ajax to login

When I use a old fashion form to login the browser it will ask me if I want to save my username and password. However I do not use form submits to login any more.
I use ajax to login and when the user logs in with the correct username and password combination the javascript will reload the page.
Is there a javascript method to tell the browsers that it has to save the login information?
How to fix this?
Put the login fields back into the form and use
$('#FormId').submit(funciton(){
//Ajax here
});
This will submit the form and perform the ajax login. The browser will still detect it.
Browsers auto detect password fields and prompt user to save it [If you are not using Ajax]. I don't think there is specify way to tell browser to save password
you could use a normal form and then:
$( "your_form" ).submit(function( event ) {
event.preventDefault();
$.ajax ...
});
You can reload a page only after receiving the login confirmation(Either success or fail). I guess you need to reload a page for success case only.
For that you can show the prompt window to remember username and password before reloading a page.
In a asynchronous call, there is possiblities to return before receiving response from server script,for that you have to use event.preventDefault();.

another Bug in jquery validator?

i use remote method of validator for checking if username exists in DB
my scenario:
form with one field (username of course)
i filled field
it passes validation, but i don't sending form yet
going to DB inserting username that i filled in form that i still don't sent yet
returning to my form press on submit btn
voila, it pass validation (here the issue if u don't understand yet)
of course i did validation on the server side too, but it will be great that validation for remote method will fire too when sending form
p.s. i'm using 1.5.5 version but see that this issue still exists
If I'm reading this properly, jQuery is not at fault here.
If this isn't correct let me know. I am imagining a registration form.
I go to your form, enter a username. jQuery says the username is available using the remote validation technique.
Before I click submit, someone else submits the same form with the same username, and gets it.
I can still submit the form, even though I have an already taken username.
This is a classic scenario. A concurrency problem. The data is now stale that was pulled by jQuery validation during my registration. You need to adjust for this scenario in your remote page or make jquery validation run on form submit as well. You could just call validate() on your form in the submit method of your form.

Categories

Resources