AJAX: check if username exists on registration in realtime

It will be ported to vB 3.5

The instructions are up-to-date (see post #8 for more information).

Hello there!

vB 3.5 is using AJAX for inline moderation and stuff like that. Pretty neat and why should we wait for something like this? :devious:

What does this hack do?
In the registration page it checks if the username the user has entered already exists. If this is true he will get a message instantly telling me to change the desired name. The submit button will also be disabled so that he can't finish the registration unless he has chosen another username which is not yet taken.


Features:
* can be turned off or on via the AdminCP
* uses the vB phrases and can easily be translated
* the user gets the error message without reloading the page
* he/she can't complete the registration if the username is taken


Do I need to be an expert to install this hack?
No, not really.. You have to upload two files, edit one file, edit one template and add some custom CSS. Besides this there are 4 queries you need to run (see the point 'Warning:' for more information). Should be pretty easy and I'll support you as good as I can.


Demo:
You may take this for a test drive at my forums but please don't complete the registration unless you want to join my german community
http://www.pagodentreff.de/diskussio...m/register.php
Just use 'dominik.h' as a username and see what happens.


Problems?
Is the new phrase not showing up? Read this: https://vborg.vbsupport.ru/showpost....5&postcount=19



Warning:
This hack doesn't have an automatic installer. However you need to run 4 different queries for this hack to work. Those queries are for the settings in your AdminCP and for the phrases only. This hack won't affect your performance
If you feel uncomfortable with running queries you may drop me a private message and I'll see what I can do for you.


I will support this hack as good as I can but please keep your questions within this thread.

Please don't forget to click install because you get an update notification and other nice things

The screenshot is taken from my translated version.

This hack wouldn't be possible without the following article and the code: http://www.xml.com/pub/a/2005/02/09/...p-request.html

[T3MEDIA]

Originally Posted by CompuJonathan

Thanks guys, got it working now. I just deleted the phrase and re added it...didn't try doing the English translation. Great work, love it!

T3MEDIA has a great suggestion, it would be very cool if we could just jack the entire signup process with this, would save the users a lot of time when they make 1 simple error in the referral and ect.

Again, excellent!
- Jonathan

Think they will take me up on it? Its about 3 other fields using the same idea. You should ask for this mod though you may get a better response.

I have a site with 21k on it and it went a bit slow. (slow as in not just poping up instantly). you need to keep in mind the users online that are doing god knows what.... and this site had the arcade going on... resource monster. around 1g online prime time.

[CompuJonathan]

T3,
Yeah, I'm not really sure how much extra work it would take to turn make that work for the password/email/referral field. But I hope it can be done and that they will do it for us!

I don't allow ASCII characters and other things on my forum, it would be too cool if it could tell them "No ASCII allowed" if they do use it.

Question: After a tab into a different filed on the sign up, an error comes up saying that 'submit' is null or not an object?

Thanks!
- Jonathan

[Oblivion Knight]

Originally Posted by CompuJonathan

Question: After a tab into a different filed on the sign up, an error comes up saying that 'submit' is null or not an object?

This was fixed here:
https://vborg.vbsupport.ru/showpost....7&postcount=23

[CompuJonathan]

This is the way I have mine, but I still get the submit error. :ermm:

<div style="margin-top:$stylevar[cellpadding]px"><input type="submit" class="button" value="$vbphrase[complete_registration]" accesskey="s" name="submitform" /><input type="reset" class="button" name="Reset" value="$vbphrase[reset_fields]" />

[MrNase]

Can you pm me with the url to your forums please?

[MrNase]

I checked your code three times and couldn't point out where the error was so here's another solution to this. I hope this one solves it.

open ajax_checkusername.js and replace:

submit    = document.register.submitform;

with

submit    = document.getElementById('submitform');

and change (in the template 'register') this:

<div style="margin-top:$stylevar[cellpadding]px"><input type="submit" class="button" value="$vbphrase[complete_registration]" accesskey="s" name="submitform" /><input type="reset" class="button" name="Reset" value="$vbphrase[reset_fields]" />

to this:

<div style="margin-top:$stylevar[cellpadding]px"><input type="submit" class="button" value="$vbphrase[complete_registration]" accesskey="s" id="submitform" /><input type="reset" class="button" name="Reset" value="$vbphrase[reset_fields]" />

Please try that and tell me if it's working

__________________________________________________ ___

Here's another solution that came up after some google searches.
Open ajax_checkusername.js and replace:

function checkName(input, response)
{
  if (response != ''){ 
    // Response mode
    message   = document.getElementById('nameCheckFailed');
    submit    = document.register.submitform;
    
    if (response == 1){
      message.className = 'registererror';
      submit.disabled = true;
    }else{
      message.className = 'registererrorhidden';
      submit.disabled = false;
    } 
  }else{
    // Input mode
    url  = 'register.php?do=checkusername&username=' + input;
    loadXMLDoc(url);
  }

}

with:

function checkName(input, response)
{
  if (response != ''){ 
    // Response mode
   var message   = document.getElementById('nameCheckFailed');
   var submit    = document.register.submitform;
    
    if (response == 1){
      message.className = 'registererror';
      submit.disabled = true;
    }else{
      message.className = 'registererrorhidden';
      submit.disabled = false;
    } 
  }else{
    // Input mode
    url  = 'register.php?do=checkusername&username=' + input;
    loadXMLDoc(url);
  }

}

This error seems pretty strange to me since the same code is working fine for me

[Zero Tolerance]

MrNase - I'm assuming the 'register' in the JS is the name of the form? I would advise using:

document.forms['register']

To call the object, it seems more browser compliant.

- Zero Tolerance

[CompuJonathan]

MrNase,
Brilliant! The first fix fixed it!

Great job! :banana:

[MrNase]

Just like Zero Tolerance said: Somehow he didn't select the submit button.. And this was necessary to disable it

Iam glad it's working. What browser are you using btw. ?

[CompuJonathan]

Internet Explorer 6.0

Thanks again!
- Jonathan