Check duplicate user with Ajax in ATG

Example to check, If user trying to register with email that already exits in ATG Profile Repository.

• Create a login page and add event to input bean

<dsp:input bean="ProfileFormHandler.value.login" value=""

                    type="email" id="emailId" name="emailId" onblur="makeGetRequest()" onclick="clearEmailMessage()"/>

• Create dummy div to capture the result -                

 <div id="description" class="error" for="emailId" style="display: inline-block;"></div>

<div id="temp_div" type="hidden" class="hide"></div>

• Add Ajax call - 

 <script type="text/javascript">

function createRequestObject() {

    var tmpXmlHttpObject;

    if (window.XMLHttpRequest) {

        tmpXmlHttpObject = new XMLHttpRequest();

    } else if (window.ActiveXObject) {

        tmpXmlHttpObject = new ActiveXObject("Microsoft.XMLHTTP");

    }

    return tmpXmlHttpObject;

}

var http = createRequestObject();

function makeGetRequest() {

var emailId = document.getElementById("emailId");

if(emailId.value == ""){

document.getElementById("description").innerHTML="";

return;

}

    http.open('get', './checkDuplicateUser.jsp?id=' + emailId.value);

    http.onreadystatechange = processResponse;

    http.send();

}

function processResponse() {

    if(http.readyState == 4){

     document.getElementById("temp_div").innerHTML = http.responseText;

        if(document.getElementById("checkDuplicate_result").innerHTML != ""){

        document.getElementById("description").innerHTML = "Email already registered.";

        } else {

        document.getElementById("description").innerHTML = "";

        }

    }

}

</script>

<script type="text/javascript">

function clearEmailMessage() {

if(document.getElementById("description").innerHTML != ""){

document.getElementById("description").innerHTML="";

}

 }

</script>

• Ajax Page - checkDuplicateUser.jsp

<%--

  - Author(s): www.learningwithadarsh.com

  - Date: 11/10/2015

  - Description:

  - This is a page to check Duplicate of user email Id.

--%>

<dsp:page>

    <dsp:importbean bean="/atg/dynamo/droplet/RQLQueryForEach" />

    <dsp:param name="loginId" value="${param.id}" />

    <div id="checkDuplicate">

        <dsp:droplet name="/atg/dynamo/droplet/RQLQueryForEach">

            <dsp:param name="queryRQL" value="login=:loginId" />

            <dsp:param name="repository" value="/atg/userprofiling/ProfileAdapterRepository" />

            <dsp:param name="itemDescriptor" value="user" />

            <dsp:oparam name="output">

             <div id="checkDuplicate_result">

                 <dsp:valueof param="element.lastName" />

                </div>        

            </dsp:oparam>

            <dsp:oparam name="empty">

             <div id="checkDuplicate_result"></div>

            </dsp:oparam>

        </dsp:droplet>

    </div>

</dsp:page>