Java Quick Notes

Ans)

Ajax stands for Asynchronous JavaScript and XML,enables us to create asynchronous web applications. By using Ajax,
the web clients (Browsers) can send data to, and retrieve data from, a server asynchronously without impacting the
the existing page. Data is usually retrieved using the XMLHttpRequest object.

Back to top

Ans)

We could make a AJAX call from browser using "XMLHttpRequest". The XMLHttpRequest
object provide a method for exchanging data asynchronously between browser and
server to avoid full page reloads.

Here is the quick example:

             function makeAjaxCall(){
                if(window.XMLHttpRequest){
                                alert("XMLHttpRequest supported by browser ee");
                                xhttp = new XMLHttpRequest();
                                        url='http://localhost:8080/test/post.do';
                                xhttp.open("GET", url, false);  
                                alert("reching your Request ?");
                                xhttp.send();
                        alert(xhttp.responseText);
                            }
                            if(window.ActiveXObject){
                                alert("ActiveXObject supported by browser");
                            }
             }

Back to top

Ans)

onreadystatechange is a event listener in AJAX,  this will be automatically invoked
for all the actions such as submiting data, finishing call etc., of any Ajax call,
and these would change the readyState property of the XMLHttpRequest object,
that will inform you if the given Ajax request is successed or failed.

So by using readyState value we can see check if a given Ajax call is successful or not,
if readyState Value is 4, we could consider that is successful. You could also check
"xmlhttp.status==200"

xmlhttp.onreadystatechange = function() {
        if(xmlhttp.readyState == 4 && xmlhttp.status==200){
            alert(xmlhttp.readyState);
        }
};
xmlhttp.open("GET","somepage.xml",true);
xmlhttp.send(null);

Back to top

Ans)

Opps stands for Object Oriented

Back to top

Ans)

You can parse the given XML string by using jQuery as follows.

function xmlParser(elementName, questionName) {
            str = "<QuestionsList><Question>What is your name?</Question>
          <Answer>Smith</Answer><
                       /QuestionsList><QuestionsList><Question>Where you born ?
        </Question><Answer>Herndon</Answer></QuestionsList>";
              
                var questionArray =new Array();
                var xml = $.parseXML(str);
                alert(xml.documentElement.nodeName);
                i=0;
                 if(elementName=="QuestionsList") {            
                var result = $(xml).find("QuestionsList").each(
                function(){ 
    var img_path = $(this).find('Question').text();
                                        var name_text = $(this).find('Answer').text();
                                        questionArray[i] = img_path;
                                        i++;
                                        alert(img_path); 
                        });
                alert(questionArray);
               }
     }

Back to top

Ans)

You have to use "JSONObject" API. Please take a look at the following Example.

import net.sf.json.JSONObject;

public class YourJSONJavaExample
{
  public static void main(String args[]){
  JSONObject object=new JSONObject();
 object.put("firstname","John");
 object.put("age",new Integer(21));
 object.put("lastname","smith");
 System.out.println(object);
  }
} 

Back to top

Ans)

JSON is short form of JavaScript Object Notation, is a lightweight text-based open standard
designed for human-readable data interchange, this could be considered as an alternative for
XML. It is derived from the JavaScript scripting language for representing simple data
structures and associative arrays, called objects.

Example JSON Schema:

{
        "name":"SampleProduct",
        "properties":
        {
                "id":
                {
                        "type":"number",
                        "required":true
                },
                "name":
                {
                        "type":"string",
                        "required":true
                },
                "price":
                {
                        "type":"number",
                       "required":true
                }
        }
 }
Example JSON object for above schema :
{
        "id": 1,
        "name": "Smith",
        "price": 88,
 }

Back to top

Ans)

Some of there below

1) DOJO
2) DWR
3) GWT ?
4) Ext JS

Back to top

Ans)

Opps stands for Object Abstraction

Back to top

Ans)

GWTC - GWT Compiler, 

GWTC compiles GWT classes and generate JavaScript.

After you create GWT classes , we need to compile them by using GWTC, here is the GWTC ANT Target.

<target name="gwtc" depends="compile,server-jar" description="GWT compile to JavaScript">
  <java failonerror="true" fork="true" classname="com.google.gwt.dev.Compiler">
   <classpath>
    <pathelement location="../gwt/src/main/java"/>
    <pathelement path="src/main/java" />
    <path refid="project.class.path" />
   </classpath>
   <jvmarg value="-Xmx256M" />
   <arg value="com.test.gwt" />
  </java>
    </target>
 

Back to top

Ans)

Opps stands for Object Abstraction

Back to top

Ans)

Racing issues, these are very serious issues if you will not design the Ajax calls properly,
this may force you to change your UI architecture some times. You have to careful while
you use Ajax for making interdependent calls.

Here are the situation you may come across, when your browser makes Two Ajax calls which
are interdependent and are expected to be run sequencially, but as these are Asyncronuos
calls you may not know which one will be completed first gets

the Response,  if you get the response of the Second Ajax call before getting the
Response of First Ajax which may be wrong and impact the functionality . 

To avoid this , you may stop the browser process as shown below.

function firstCall() {
  //do some things
  setTimeout(secondCall, 1000)
  }

  function secondCall() {
  //finish doing things after the pause
  }
 

Please note this is not a optimal solution, because there are some chances that this also
may not work If the FirstCall is not completed in "1000" Milli Secs.

Back to top

Ans)

Step 1 : Create a Service "YourPageManager" with different methods

  Step 2: Add the following Spring Config.

<dwr:remote javascript="YourPageManagerJS">
   <dwr:include method="getAccountSalesList"/> 
   <dwr:include method="getEmailAddressByWebUserObjid"/> 
   <dwr:include method="getStates"/> 
   <dwr:include method="getTransportType"/>
   <dwr:include method="getContacts"/> 
   <dwr:include method="findContacts"/>
   <dwr:filter class="com.your.ajax.DwrSecurityFilter"/>
  </dwr:remote>

 
    <dwr:configuration>
     <dwr:convert type="bean" class="com.yourApp.ContactDetails"
     javascript="Contact" />
 </dwr:configuration>
 <bean id="Contact" class="com.yourApp.ContactDetails">
 </bean>

Step 3 :

Add the following to JSP

Jsp changes :
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/engine.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/util.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/dwr/interface/YourPageManagerJS.js"></script>

YourPageManagerJS.addContactsToDTO(contactInfo, function(data){    
    window.saveClicked = false; 
    window.contactSaved = true;
     
       });

Back to top

Ans)

As mentioned in one of the above questions, DOJO is one of the popular Ajax Technologies
which enables you to

make HTTP calls Asyncronously.

Step 1:
Include DOJO libraries (.js files)

 <script type="text/javascript" src="<c:url value="/includes/dojo_nav/js/
 dojo-release-0.9.0/dojo/dojo.js"/>"></script>
 <script type="text/javascript" src="<c:url value="/includes/dojo_nav/js/
 dojo-release-0.9.0/dojo/parser.js"/>"></script>
 
Step 2:

Write Java Script method to make a Serverside call.

function fillContactFields() {
  
 dojo.xhrGet( {
        url: "<c:url value="/populateContact.do"/>",
        handleAs: "json",
  form: dojo.byId("populateContactForm"),
        load: function(response) {
  populateSiteFields(response);
          return response;
        },
        // The ERROR function will be called in an error case.
        error:  function(type, data, evt){alert("Error");}
       });
}

Step 2:
Display the result in whichever way to want.

//function populateContactFields(type, data, evt) {
function populateSiteFields(data) {
    var contactId, address1, address2, city, state, zip, contactName, siteTenantType;
    contactId = document.forms[0].contactId;
    contactId.value = "0";
  
    if (data.contactId) {
       contactId.value = data.contactId;          
    }
    address1 = document.getElementById("address1");
    address1.value = "";
    if (data.address1) {
        address1.value = data.address1;
    }

    address2 = document.getElementById("address2");
    address2.value = "";
    if (data.address2) {
        address2.value = data.address2;
    }

    city = document.getElementById("city");
    city.value = "";
    if (data.city) {
        city.value = data.city;
    }

    state = document.getElementById("state");
    state.vaue = "";
    if (data.state) {
        state.value = data.state;
    }

    zip = document.getElementById("zip");
    zip.value = "";
    if (data.zip) {
        zip.value = data.zip;
    }

    siteName = document.getElementById("siteName");
    siteName.value = "";
    if (data.siteName) {
        siteName.value = data.siteName;
    }
}

Back to top