CODEWITHSUNDEEP
javascriptphpjqueryhtml
user3640056
user3640056

Reputation: 732

Dynamic PHP Code For Inputting User Info

I'm working on a PHP form for inputting user information. I have these 3 important fields: First Name, Last Name, and E-mail. What I need to do is to set the E-mail automatically when the user enters the first two fields and before saving. For example when the user types 'First' in the First Name and 'Last' in the Last Name fields, the E-mail field should automatically show [email protected].

The code is already written and this is the part I'm working on:

echo '<TABLE ><TR><TD >'.TextInput($student['FIRST_NAME'],'students[FIRST_NAME]','<FONT color=red>'._('First').'</FONT>','size=12 class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.TextInput($student['MIDDLE_NAME'],'students[MIDDLE_NAME]',''._('Middle').'','class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.TextInput($student['LAST_NAME'],'students[LAST_NAME]','<FONT color=red>'._('Last').'</FONT>','size=12 class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.SelectInput($student['NAME_SUFFIX'],'students[NAME_SUFFIX]',''._('Suffix').'',array('Jr.'=>'Jr.','Sr.'=>'Sr.','II'=>'II','III'=>'III','IV'=>'IV','V'=>'V'),'','style="font-size:14px; font-weight:bold;"').'</TD></TR></TABLE>';

else
echo '<DIV id=student_name><div style="font-size:14px; font-weight:bold;" onclick=\'addHTML("<TABLE><TR><TD>'.str_replace('"','\"',TextInput($student['FIRST_NAME'],'students[FIRST_NAME]','','maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',TextInput($student['MIDDLE_NAME'],'students[MIDDLE_NAME]','','size=3 maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',TextInput($student['LAST_NAME'],'students[LAST_NAME]','','maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',SelectInput($student['NAME_SUFFIX'],'students[NAME_SUFFIX]','',array('Jr.'=>'Jr.','Sr.'=>'Sr.','II'=>'II','III'=>'III','IV'=>'IV','V'=>'V'),'','style="font-size:14px; font-weight:bold;"',false)).'</TD></TR></TABLE>","student_name",true);\'>'.$student['FIRST_NAME'].' '.$student['MIDDLE_NAME'].' '.$student['LAST_NAME'].' '.$student['NAME_SUFFIX'].'</div></DIV>';
echo'</td></tr>';


echo '<tr><td>'._('Email').'</td><td>:</td><td>'.TextInput($student['EMAIL'],'students[EMAIL]','','size=100 class=cell_medium maxlength=100').'</td></tr>';

I don't know how I'm supposed to edit it or where to add the jquery code :/ I appreciate your help, thank you :)

Upvotes: 0

Views: 99

Answers (3)

ghorg12110
ghorg12110

Reputation: 36

HTML

First Name : <input type="text" id="firstName" value=""><br />
Last Name : <input type="text" id="lastName" onchange="createEmail()"><br />
Email : <input type="text" id="email">

Javascript

<script>
function createEmail() {
    var fn = document.getElementById("firstName").value;
    var ln = document.getElementById("lastName").value;
    document.getElementById("email").value = fn+"."+ln+"@example.com";
}
</script>

Upvotes: 1

jogesh_pi
jogesh_pi

Reputation: 9782

You don't need ajax for this, take a look on the DEMO

$('body').on('blur', '.firstname, .lastname', function(){
    var fname = $.trim($('.firstname').val()), 
        lname = $.trim($('.lastname').val()), 
        email = $('#email'), 

        // Set your domain name here
        prefix = '@example.com';

    if( fname != "" && lname != "" )
        email.val( fname + '.' + lname + prefix );
    else if( fname == "" && lname == "" )
        email.val("");
    else 
        email.val( (fname != "" ? fname : lname) + prefix );

});

Upvotes: 1

vaso123
vaso123

Reputation: 12391

There are no need any ajax for this.

Use the jQuery blur function to test, is the user has leaved the text input field (or use the keyup), and test, is the first/last name is filled. If yes, then you can get the values of the fields with val() function, and then you can generate the email, and set the value of the email field.

You need something like this:

$('#firstName', '#lastName').keyup(function() {
    var domain = 'example.com';
    var email = $('#firtName').val() + '.' + $('#lastName').val() + '@' + domain;
    $('#email').val(email);
});

Upvotes: 1

Related Questions