Forums

Hello again,

I have successfully created a registration form with cf - but notice that for some reason If I try to register with a username or with an email that is already in the jos_users table, I will not be able to full register - but I get no errors??

how can I get the messages that say: ' that username is already in use" etc??

Also - can I perform this check with AJAX so that the form does not have to be submitted before I know the username or email is taken?

Thanks guys!!

Hi samoht,

Yes you can do it with Ajax, or with server-side validation.

IIRC there was an Ajax post a couple of months ago and a serverside validation one in the last week or so.

Bob

Thank Bob,

I am reading up on some of them right now. hopefully I can get it working with out questions of my own, but if not, I will post here

well - unfortunately I do have questions.

I added a few server side functions to catch double entry for username and email - So that pretty much takes care of what I wanted, but I would like to do a ajax validation check like 'community builder' (in there registration form)

So I tried creating a new form for the ajax php and javascript and basically just put the same server side validation in the Form HTML:

<?php
//check if user exist
global $db;
$db =& JFactory::getDBO();
//$text =& JRequest::getString('value', '', 'get');
$text =& JRequest:: getString('value');
$sql = "
    SELECT COUNT(*)
        FROM jos_users
        WHERE username = ".$db->quote($text).";";
if ( $debug ) echo "sql: ".print_r($sql, true)."<br /><br />";
$db->setQuery( $sql );
   if ( $database->loadResult() != 0 )
     {echo "Username Already Taken";}
   else
     {echo "This Username is available";}
?>

Then in my registration form I added this in the Javascript box:

window.addEvent('domready', function() { 
      $('ajax-replace').addEvent('blur', function(e) {
      e = new Event(e).stop();

      var username=$('uname').value;
      var url = "index2.php?option=com_chronocontact&chronoformname=ajax_form&value=username";
  
      new Ajax(url, {
         method: 'get',
         update: $('username_msg')
      }).request();
   });
});

but I am not sure I put this in the right spot? - nor do I see anything when the username field is filled out ??

Max mentioned something about submitting the whole form and using getElementbyId - I think?? but where would that code go?

why not just hack the mooValidation.js script??

Hi samoht,

I used the result parsing method posted by Max and Salman in this thread to create a pair of forms that work OK. This is the Form HTML from the 'registration form' ( Validation needs to be enabled to make sure that the MooTools library is loaded.)

<?php
$script = "window.addEvent('domready', function() {
  $('uname').addEvent('blur', function(e) {
    e = new Event(e).stop();

    var username = $('uname').value;
    if ( username != '' ) {
      var url = 'index2.php?option=com_chronocontact&chronoformname=test_form_16a&value=username&tmpl=component';
 
      new Ajax(url, {
        method: 'get',
        onSuccess: parseResult
      }).request();
    }
    function parseResult(request)
    {
      var msg = request.split('##@##');
      $('username_msg').setHTML(msg[1]);
    }

  });
});";
$doc =& JFactory::getDocument();
$doc->addScriptDeclaration($script);
?>
<div>
  <input type='text' name='uname' id='uname' value='' />
</div>
<div id='username_msg' > </div>
<input type='submit' name='submit' />

and this is the AJAX responder form

<?php
$db =& JFactory::getDBO();
$text =& JRequest:: getString('value');
$sql = "
    SELECT COUNT(*)
        FROM `#__users`
        WHERE `username` = ".$db->quote($text).";";
$db->setQuery( $sql );
echo "##@##";
if ( $database->loadResult() != 0 ) {
  echo "Username Already Taken";
} else {
  echo "This Username is available";
}
echo "##@##";
?>

A couple of changes - the AJAX is only called if the input field has an entry; and the result is sent back as ##@##result string##@## so that the result string can be parsed out of the rest of the page html.

Bob

Thanks Bob,

That looks good - and is quite a bit more clear than the instructions on the other thread.
However, I am getting the wrong response?
I changed the link to reflect my ajax form:

yours:

var url = 'index2.php?option=com_chronocontact&chronoformname=test_form_16a&value=username&tmpl=component';

mine:

var url = 'index2.php?option=com_chronocontact&chronoformname=ajax_form&value=username&tmpl=component';

but when I type in usernames that I know exist - I still get the message "This username is available"?

Also - I checked the url by manually putting it into the browser window and then swapping out "username" for the different usernames I wanted to test and the output was correct? This must mean that the ajax form is working properly but the script to send the value for "username" in the url is not working (I think?)

Hi samoht,

Put some debug code in the second form then to out put the query - if you have Firebug running you can see the whole page being returned and check the sql.

Bob

ok,

I tried putting in a print_r in the ajax form but then nothing shows?
What kind of debug were you thinking?

when I checked in firebug I saw that the GET was not sending the actual username but just "username" eachtime. Since I dont have any users with the username = "username" I am always getting the return "This Username is avialable"

so the problem I have must be in my var username

Hi samoht,

OK - so the URL needs changing to include the username you are testing

var url = 'index2.php?option=com_chronocontact&chronoformname=test_form_16a&value='+username+'&tmpl=component';

should do it.

Sorry, didn't check that.

Bob

Beautiful!

This is very helpful. I may try to put together a small tut for other cf users.

thanks again.

This is utterly wonderful been looking for it for weeks. Thanks Bob.

Yes, thanks to Bob I now have a nice ajax check in place.

I added an animated gif for the wait process and also added a little style to change the notice to red or green depending on the result - and created another piece to check the users email as well.

Here is my Form HTML on the registration form:

<?php
$script = "window.addEvent('domready', function() {
  $('uname').addEvent('blur', function(e) {
    e = new Event(e).stop();

    // Show the spinning indicator when pressing the submit button...  
    $('indicator1').setStyle('display','block');

    var username = $('uname').value;
    if ( username != '' ) {
      var url = 'index2.php?option=com_chronocontact&chronoformname=ajax_form&username='+username+'&tmpl=component';

      new Ajax(url, {
        method: 'get',
        onSuccess: parseResult
      }).request();
    }
    function parseResult(request)
    {
      $('indicator1').setStyle('display','none');

      var msg = request.split('##@##');
      $('username_msg').setHTML(msg[1]);
    }

  });
  
    $('email').addEvent('blur', function(e) {
    e = new Event(e).stop();

    // Show the spinning indicator when pressing the submit button...  
    $('indicator2').setStyle('display','block');

    var email = $('email').value;
    if ( email != '' ) {
      var url = 'index2.php?option=com_chronocontact&chronoformname=ajax_form&email='+email+'&tmpl=component';

      new Ajax(url, {
        method: 'get',
        onSuccess: parseResult
      }).request();
    }
    function parseResult(request)
    {
      $('indicator2').setStyle('display','none');

      var msg = request.split('##@##');
      $('email_msg').setHTML(msg[1]);
    }

  });
  
});";
$doc =& JFactory::getDocument();
$doc->addScriptDeclaration($script);
?>
<style type="text/css">.red{color:red;} .green{color:green;}</style>
 .   .  .

td align="right" width="17%"><label class="cf_label">Email:</label></td>
				<td align="left" width="27%"><input class="cf_inputbox required validate-email" maxlength="150" size="30" id="email" name="email" type="text"><span id="indicator2" style="display: none"><img src="/images/spinner2.gif" alt="checking..." /></span><div id='email_msg' ></div></td>
			</tr>
			<tr>
				<td align="right" width="17%"><label class="cf_label">Username:</label></td>
				<td align="left" width="27%"><input class="cf_inputbox required validate-alphanum" maxlength="150" size="30" id="uname" name="uname" type="text"><span id="indicator1" style="display: none"><img src="/images/spinner2.gif" alt="checking..." /></span><div id='username_msg' ></div></td>
 .    .   .

and then here is the Form HTML on the ajax_form:
(notice: I had to parse the url to know which variable was being sent to me that is why I have the foreach. Also, if I was going to do this for even more fields I would use a switch case inside the foreach instead of the "if")

<?php
$db =& JFactory::getDBO();
$myurl =& JRequest:: geturi();

foreach ($_GET as $key => $val) {

   if ($key == 'username'){
      // username code
		$text =& JRequest:: getString('username');
		$sql = "
			SELECT COUNT(*)
				FROM `#__users`
				WHERE `username` = ".$db->quote($text).";";
		$db->setQuery( $sql );
		echo "##@##";
		if ( $database->loadResult() != 0 ) {
		  echo '<span class="red">Username Already Taken</span>';
		} else {
		  echo '<span class="green">This Username is available</span>';
		}
		echo "##@##";
   }
   elseif ($key == 'email'){
      // email code
		$regemail =& JRequest:: getString('email');
		$sql = "
		    SELECT COUNT(*)
		        FROM `#__users`
		        WHERE `email` = ".$db->quote($regemail).";";
		$db->setQuery( $sql );
		echo "##@##";
		if ( $database->loadResult() != 0 ) {
		  echo '<span class="red">Email Already Taken</span>';
		} else {
		  echo '<span class="green">This email is available</span>';
		}
		echo "##@##";
   }

}
?>

Hope this helps!

Thanks for posting this! 🙂

Regards,
Max

The information is really useful and helpful, I had the same that "username is already in use" problem but the links helped a lot. thans