[Resolved] One code login

[Author]

Posts

[katjaL]

Hi,
I'm trying to create a seemingly passwordless login -> the user logs in with only one code. The procedure is at the moment like this:

1. User registrates himself and
- the username is created automatically of randomcode+timestamp
- the password is created automatically of timestamp (hidden field)

2. User should be able to log in with one code only (previously created username)
- the password would be automatically the last 10 digits (timestamp) of the username (hidden field)

My problem is the point 2: the login form doesn't know the username until hitting submit.

Could you help me to solve this problem or perhaps I should solve this some other way? Thank you!

[Waqar]

Hi,

Thank you for contacting us and I'd be happy to assist.

To achieve this, you can follow these steps:

1. You can include the username and password fields in the user form, but hide them through custom CSS code so users can see and change the values in them.

2. For the username field, you can include the 'value' attribute in its field shortcode to fill the randomly generated value.
( you can register a custom shortcode to populate this random value and use that for the 'value' attribute )

Example:

[cred_field field='user_login' class='form-control' output='bootstrap' value='[custom-shortcode]']

Note: You'll replace 'custom-shortcode' with your actual custom shortcode's name.

3. For filling the passwords fields with the last 10 characters of the generated username, you can use a custom script:

jQuery(document).ready(function( $ ) {
	// get username value
	var currentUsername = $('input[name="user_login"]').val();
	if(currentUsername.length != 0) {
		// get password fields to have last 10 characters from the username
		$('input[name="user_pass"]').val(currentUsername.slice(-10));
		$('input[name="user_pass2"]').val(currentUsername.slice(-10));
	}
});

It can be included in the form's 'JS editor' and once the form will load, it will get the username field value and fill the last 10 characters from it, into the two password fields.

I hope this helps and please let me know if you need further assistance.

regards,
Waqar

[katjaL]

Hi Waqar, thank you very much!

To be absolutely clear: I need to create a LOGIN FORM, not registration form. I already have this registration and also after that autologin solved.

My problem now is how the user can log in LATER, with his username only. Since I'm not a coder, perhaps this code you gave has the answer already and I just don't quite understand how to implement it.

[Waqar]

Thanks for writing back and I apologize for missing out on the part about the login form.

For the login form, you can use a slightly different script:

jQuery(document).ready(function( $ ) {
	$('form[name=loginform] input[name=log]').keyup(function() {
		var currentUsername = $('form[name=loginform] input[name=log]').val();
		if(currentUsername.length != 0) {
			// get password fields to have last 10 characters from the username
			$('form[name=loginform] input[name=pwd]').val(currentUsername.slice(-10));
		}
	});
});

Assuming you're using the 'wpv-login-form' shortcode for the login form ( ref: https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-login-form ) and the password field has been hidden, using custom CSS code.

The custom script can be included in the JS editor of the content template that is used for the login page. If you're not using a content template for the login page, you can include it through any custom script feature that you may have on the website.

[katjaL]

Hi Waqar and thank you! That works perfectly 🙂