Search:
tqExpert Help
print
|
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

User ID Page

For an eCommerce User ID registration/login page, this topic contains the following:
  • A screen capture of the relevant part of an actual User ID page
  • The inner template on which the page is based
  • The Webpage source generated by tqTag Web Suite for the relevant parts of the page

User ID Screen Capture

The labels on the screen-capture indicate the tqTags that support creation and identification of registered users:
  • login — password verification for a registered user
  • register — input of information to create a new registered user
  • countryList — displays a drop-down list of countries from which site visitors can select the country that they need
  • stateList — displays a drop-down list of U.S.A. states from which site visitors can select the state that they need
To access this page online, do the following:
  1. Go to http://israelmint.com/?section=185 (as shown in Products Page) and select one or more products.
  2. Continue as shown in Shopping Cart and then click Proceed to Checkout.

User ID screen capture

Inner Template #460

The template for this login/registration page is not accessible through the online Website.

<tqtag type="settings" imageDirectory="images"></tqtag>
<tqtag type="alternative" name="alternative0">
    <script type="text/javascript">location.href='@linkToStep3@'</script>
</tqtag>
<div class="Content">           
    <div class="ShoppingCart">
        <div class="Process">
            <div class="Checkout">Check out process</div>
            <ul class="Levels">
                <li class="Level1"><a href="@linkToStep1@">shopping cart</a></li>   
                <li class="Level2"><a class="selected" href="@linkToStep2@">user identification</a></li>
                <li class="Level3"><a href="@linkToStep3@">delivery address</a></li>
                <li class="Level4"><a href="@linkToStep4@">means of payment</a></li>
            </ul>
        </div>
        <div class="acenter">
            <div class="UserIdentificationCont">
                <div class="RegistredUsersEntry">
                    <tqtag type="login" name="loginBox" loginAuthMethod="cookie" htmlObjectName="loginForm1" htmlObjectID="loginForm1">
                    <input type="hidden" name="authLoginSuccess" value="@linkToStep3@" />
                    <input type="hidden" name="authLoginFail" value="@linkToStep2@" />
                    <h1>Registered users' entry</h1>
                    <span>username</span>
                    <input class="designed" type="text" name="tqUserName" />
                    <span>password</span>
                    <input class="designed" type="password" name="tqUserPass" />
                    <div class="Buttons">
                        <div class="Button">
                            <div class="L"></div>
                            <div class="C">forgot password</div>
                            <div class="R"></div>
                        </div>
                        <div class="Button">
                            <div class="L"></div>
                            <div class="C red"><button type="submit" class="red" style="background:transparent;border:none;">enter</button></div>
                            <div class="R"></div>
                        </div>
                         </tqtag>
                    </div>
                    <div class="info">
                        <p>
                            Registered clients who have forgoten their passwords may receive a new password through the email.
                            Clients who have registered in the past without entering an email address, and who have forgoten their password, are requested to <a href="?section=243">contact</a> the webmaster.
                        </p>
                    </div>
                </div>
                <div class="Registration">
                    <tqtag type="register" name="mailingList0" title="BecomeRegisteredUser" alternativeTag="alternative0" alternativeCondition="isLoggedIn" htmlObjectName="registerFrm" onSubmitJsFunction="checkRegisterForm()">
                        <input type="hidden" name="mailingListRedirect" value="@linkToStep3@" />                       
                    <input type="hidden" name="saveToSession" value="registerInfo" />
                    <input type="hidden" name="errorMessage" value="UserName taken" />
                    <h2>New client registration</h2>
                        <div class="FormRow">
                            <div class="FieldName">First name</div>
                            <div class="FieldControl"><input type="text" id="fName" name="fName" onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Last name</div>
                            <div class="FieldControl"><input type="text" id="lName" name="lName"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Birth Date</div>
                            <div class="FieldControl">
                                <input type="hidden" id="birthDate" name="birthDate"/>
                                <select id="formDay" style="float:left; width:45px; margin-right:3px;">
                                </select>
                                <select id="formMonth" style="float:left; width:50px; margin-right:3px;">
                                <option value="1">Jan
                                <option value="2">Feb
                                <option value="3">Mar
                                <option value="4">Apr
                                <option value="5">May
                                <option value="6">Jun
                                <option value="7">Jul
                                <option value="8">Aug
                                <option value="9">Sep
                                <option value="10">Oct
                                <option value="11">Nov
                                <option value="12">Dec
                                </select>
                                <select id="formYear" style="float:left; width:70px">
                                </select>
                                <script type="text/javascript">
                                dayCtrl = document.getElementById('formDay');   
                                yearCtrl = document.getElementById('formYear');   
                                    var d = new Date();
                                    currentYear = d.getFullYear();
                                    var start = 1900;
                                    var len = currentYear - start;
                                    yearCtrl.length = len;
                                    for(i=start; i<=currentYear; i++) {
                                      var newOpt = new Option(i, i);
                                      yearCtrl.options[i-start] = newOpt;
                                    }   
                                    for(i=1; i<=31; i++) {
                                      var newOpt = new Option(i, i);
                                      dayCtrl.options[i-1] = newOpt;
                                    }   
                                </script>
                            </div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormSeperator"></div>
                        <div class="FormRow">
                            <div class="FieldName">Address</div>
                            <div class="FieldControl"><input type="text" id="address"  name="address" onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">City</div>
                            <div class="FieldControl"><input type="text" id="city" name="city"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                       
                        <div class="FormRow">
                            <div class="FieldName">State/Province</div>
                            <div class="FieldControl">
                                <select name="stateID" size="1" style="width:200px; float:left;"  onfocus="changeBackroundColor(this.id,'white');" >
                                    <tqtag type="stateList" name="state">
                                        <option value="@id@" id="@id@">@title@</option>
                                    </tqtag>
                                </select>
                            </div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Country</div>
                            <div class="FieldControl">
                                <select name="countryID" size="1" style="width:200px; float:left;"  onfocus="changeBackroundColor(this.id,'white');" >
                                    <tqtag type="countryList" name="country">
                                        <option value="@countryID@" id="@countryID@">@countryNameEn@</option>
                                    </tqtag>
                                </select>
                            </div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Zip code</div>
                            <div class="FieldControl"><input type="text" id="postalCode" name="postalCode"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormSeperator"></div>
                        <div class="FormRow">
                            <div class="FieldName">Email</div>
                            <div class="FieldControl"><input type="text" id="email"  name="email" onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Telephone 1</div>
                            <div class="FieldControl"><input type="text" id="phone" name="phone"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Telephone 2</div>
                            <div class="FieldControl"><input type="text" id="phone1" name="phone1" /></div>
                        </div>
                        <div class="FormSeperator"></div>
                        <div class="FormRow">
                            <div class="FieldName">Subscription # <span>(if relevant)</span></div>
                            <div class="FieldControl"><input type="text" id="subscription" name="subscription" /></div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">User name</div>
                            <div class="FieldControl"><input type="text" id="userName" name="userName"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Password <span>(at least 6 letters)</span></div>
                            <div class="FieldControl"><input type="password" id="userPass" name="userPass"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormRow">
                            <div class="FieldName">Repeat password</div>
                            <div class="FieldControl"><input type="password" id="userPassVer" name="userPassVer" onfocus="changeBackroundColor(this.id,'white');" /></div>
                            <div class="Validation">&nbsp;</div>
                        </div>
                        <div class="FormSeperator"></div>
                        <div class="agree">
                            <span style="line-height: 16px;"><strong>I would like to receive discounts and newsletters in the future</strong>
                                 <br /><input name="mailListAction" type="radio"  value="i" checked="checked"/> Yes    <input name="mailListAction" type="radio"  value="d" /> No           
                            </span>       
                        </div>
                        <div class="FormSeperator"></div>
                        <div class="FormBottom">
                            <div class="BulletInfo"><img src="images/form-bullet.gif" alt="required field" /> <span class="red">= required</span></div>
                            <div class="Buttons">
                                <div class="Button">
                                <div class="C"><button type="reset" class="blue" style="background:transparent;border:none;font-weight:bold;">clear form</button></div>
                                </div>
                                <div class="Button">
                                <div class="C red"><button type="submit" class="red" style="background:transparent;border:none;font-weight:bold;">submit</button></div>
                                </div>
                            </div>
                        </div>
                    </tqtag>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
function checkDate(){
    dateStr = document.getElementById("birthDate");
    day = document.getElementById("formDay");
    month = document.getElementById("formMonth");
    year = document.getElementById("formYear");
    if (day.value==1 && month.value==1 && year.value == 1900){
        alert("Please enter your date of birth");
        return(false);
    }   
    dateStr.value = day.value+"/"+month.value+"/"+year.value;
    var dayobj = new Date(year.value, month.value-1, day.value);
    if ((dayobj.getMonth()+1!=month.value)||(dayobj.getDate()!=day.value)||(dayobj.getFullYear()!=year.value)){
        alert("Invalid date. Please correct and submit again.");
        dateStr.value="";
        return false;
    }
    return (true);
}   

function checkRegisterForm() {
    var passOkay = 0;
    var emailOkay = 0;
    var fNameOkay = 0;
    var lNameOkay = 0;
    var birthDateOkay = 0;
    var addressOkay = 0;
    var cityOkay = 0;
    var postalOkay = 0;
    var userOkay = 0;
    var phoneOkay = 0;
    if (checkPassesEx('userPass','userPassVer','Password fields does not match',6,'#ff0000','#ffffff')===false) {passOkay = 0;} else { passOkay = 1;}       
    if (checkEmail('email')===true) emailOkay=1; else emailOkay=0;
    if (checkInputData("userName","user name","fNameFail",4,"errorField","")===true)  userOkay=1; else userOkay=0;   
    if (checkInputData("fName","first name","fNameFail",2,"errorField","")===true)  fNameOkay=1; else fNameOkay=0;   
    if (checkInputData("lName","last name","lNameFail",2,"errorField","")===true)  lNameOkay=1; else lNameOkay=0;
    if (checkInputData("birthDate","birth date","birthDateFail",10,"errorField","")===true)  birthDateOkay=1; else birthDateOkay=0;
    if (checkInputData("address","address","addressFail",4,"errorField","")===true)  addressOkay=1; else addressOkay=0;
    if (checkInputData("city","city","cityFail",4,"errorField","")===true)  cityOkay=1; else cityOkay=0;
    if (checkInputData("postalCode","Postal Code","postaFail",4,"errorField","")===true)  postalOkay=1; else postalOkay=0;
    if (checkInputData("phone","Phone number","phoneFail",4,"errorField","")===true)  phoneOkay=1; else phoneOkay=0;
    if ((emailOkay == 1) && (userOkay == 1) && (passOkay == 1)  && (fNameOkay==1)&& (lNameOkay==1)&& (addressOkay==1)&& (cityOkay==1)&& (postalOkay==1) && (phoneOkay==1)) {       
        if (!checkDate()) return false;
        var r = new RegExp("(.*)/(.*)/(.*)");
        var bDate = document.getElementById('birthDate').value;
        document.getElementById('birthDate').value = r.test(bDate) ? RegExp.$3+"-"+RegExp.$2+"-"+RegExp.$1 : "";
        return true;
    } else {
        alert ('Not all required fields filled or wrong input');
        return false;
    }

}

</script>

Login Source Code (partial)

To access the complete source code for this page, do the following:
  1. Perform the instructions under User ID Screen Capture above.
  2. Use your browser commands to view the page source.

<div class="RegistredUsersEntry">
    <form method="post" action="/index.php" id="loginForm1" name="loginForm1">
        <input type="hidden" name="mode" value="checkLogin" />
        <input type="hidden" name="authLoginFail" value="https://israelmint-com.ezadmin.eu?section=165" />
        <input type="hidden" name="authLoginSuccess" value="https://israelmint-com.ezadmin.eu?section=165" />
        <input type="hidden" name="authLoginSuccess" value="https://israelmint-com.ezadmin.eu?section=201" />
        <input type="hidden" name="authLoginFail" value="https://israelmint-com.ezadmin.eu?section=200" />
        <h1>Registered users' entry</h1>
        <span>username</span>
        <input class="designed" type="text" name="tqUserName" />
        <span>password</span>
        <input class="designed" type="password" name="tqUserPass" />
        <div class="Buttons">
            <div class="Button">
                <div class="L"></div>
                <div class="C">forgot password</div>
                <div class="R"></div>
            </div>
            <div class="Button">
                <div class="L"></div>
                <div class="C red"><button type="submit" class="red" style="background:transparent;border:none;">enter</button></div>
                <div class="R"></div>
            </div>
    </form>
        </div>
    <div class="info">
        <p> Registered clients who have forgoten their passwords may receive a new password through the email.
        Clients who have registered in the past without entering an email address, and who have forgoten their password, are requested to <a href="?section=243">contact</a> the webmaster.
        </p>
    </div>
</div>   

Registration Source Code (partial)

To access the complete source code for this page, do the following:
  1. Perform the instructions under User ID Screen Capture above.
  2. Use your browser commands to view the page source.

<div class="Registration">
    <form method="post"  action="/index.php"  onsubmit="return checkRegisterForm()"  id="mailingListmailingList0" name="registerFrm">
        <input type="hidden" name="mode" value="@registerForm@" />
        <input type="hidden" name="groupID" value="" />
        <input type="hidden" name="mailingListRedirect" value="https://israelmint-com.ezadmin.eu?section=165" />
        <input type="hidden" name="mailingListRedirect" value="https://israelmint-com.ezadmin.eu?section=201" />                       
        <input type="hidden" name="saveToSession" value="registerInfo" />
        <input type="hidden" name="errorMessage" value="UserName taken" />
        <h2>New client registration</h2>
        <div class="FormRow">
            <div class="FieldName">First name</div>
            <div class="FieldControl"><input type="text" id="fName" name="fName" onfocus="changeBackroundColor(this.id,'white');" /></div>
            <div class="Validation">&nbsp;</div>
        </div>
        <div class="FormRow">
            <div class="FieldName">Last name</div>
            <div class="FieldControl"><input type="text" id="lName" name="lName"  onfocus="changeBackroundColor(this.id,'white');" /></div>
            <div class="Validation">&nbsp;</div>
        </div>
        <div class="FormRow">
            <div class="FieldName">Birth Date</div>
            <div class="FieldControl">
                <input type="hidden" id="birthDate" name="birthDate"/>
                <select id="formDay" style="float:left; width:45px; margin-right:3px;"></select>
                <select id="formMonth" style="float:left; width:50px; margin-right:3px;">
                    <option value="1">Jan
                    <option value="2">Feb
                    <option value="3">Mar
                    <option value="4">Apr
                    <option value="5">May
                    <option value="6">Jun
                    <option value="7">Jul
                    <option value="8">Aug
                    <option value="9">Sep
                    <option value="10">Oct
                    <option value="11">Nov
                    <option value="12">Dec
                </select>
                <select id="formYear" style="float:left; width:70px"></select>
                <script type="text/javascript">
                    dayCtrl = document.getElementById('formDay');   
                    yearCtrl = document.getElementById('formYear');   
                    var d = new Date();
                    currentYear = d.getFullYear();
                    var start = 1900;
                    var len = currentYear - start;
                    yearCtrl.length = len;
                    for(i=start; i<=currentYear; i++) {
                        var newOpt = new Option(i, i);
                        yearCtrl.options[i-start] = newOpt;
                    }   
                    for(i=1; i<=31; i++) {
                        var newOpt = new Option(i, i);
                        dayCtrl.options[i-1] = newOpt;
                    }   
                </script>
            </div>
            <div class="Validation">&nbsp;</div>
        </div>
        <div class="FormSeperator"></div>
        <div class="FormRow">
            <div class="FieldName">Address</div>
                <div class="FieldControl"><input type="text" id="address"  name="address" onfocus="changeBackroundColor(this.id,'white');" /></div>
                <div class="Validation">&nbsp;</div>
            </div>
            <div class="FormRow">
                <div class="FieldName">City</div>
                <div class="FieldControl"><input type="text" id="city" name="city"  onfocus="changeBackroundColor(this.id,'white');" /></div>
                <div class="Validation">&nbsp;</div>
            </div>

User Notes

  Add Note

Topic: User ID Page