Handling JSON Request and Response

Note: I have Explained this in Spring Please Modify The Accordingly.

HTML Page

<div class="signIn-box">
    <form  id="UserLoginForm" method="post" action="javascript:void(0);">
        <div style="display:none;">
<input type="hidden" id ="loginaction" name="action" value="${hosturi}application/login.htm">
</div>
    <label>User Name:</label>
        <input name="loginUsername" type="text"  maxlength="15" id="UserUsername">
        <label>Password:</label>
        <input type="password" name="loginPassword" id="UserPassword">

         <input type="submit" name="login" id="login" value="LOGIN" onclick="return submitLogin();"/>
      </form>
</div>

<span id="status"></span>
<span id="userdata"></span>

-------------------------------------------------------------------------------------------------------------------

Script

function submitLogin(){

// Gets The Form Data and Stores in the Variable
var postData = $('#UserLoginForm').serialize();

// gets the URL to Submit the Form Data
   var formURL = $('#loginaction').val();

   $.ajax({
       url : formURL,

//Type of Method to Submit the Form Data
       type: "POST",
       data : postData,
     
// Form Data Response Handler
       success:function(responseText){
        if(responseText.status == 'success'){
       
var user = responseText.uservo;

var userMsg = 'Hi ' + user.getUserName + ' your password is ' + user.getPassword + ' Thank you ';

        $('#status').html("Logged In");
        $('#userdata').append(userMsg);

        }else if(responseText.status == 'notActivated'){
        $('#loginmessages').html("<span style='font-size:12px;'>Your account is not activated. Please click on the link sent to your registered email and activate your account</span>");
          }
       },
       error: function(jqXHR, textStatus, errorThrown){
alert('enter valid credentials');
        unblock();
       }
   });
}

-------------------------------------------------------------------------------------------------------------------

Spring Controller Class

@RequestMapping(value = "login", method = RequestMethod.POST)
public String login(HttpServletRequest request, HttpServletResponse response, Model model){
userService.getUser(request,response,model);
response.setContentType("application/json");
        return "jsonView";

}

-------------------------------------------------------------------------------------------------------------------

Spring Service Class

@Transactional
public void getUser(HttpServletRequest request,HttpServletResponse response, Model model){

String userName = request.getParameter("loginUsername");
String password = request.getParameter("loginPassword");
if(userName != null && !userName.isEmpty() && password != null && !password.isEmpty()){

// Write the code connect to database and check the user in the database and password are matched

UserVO uservo = new UserVO();
uservo.setUserName(userName);
uservo.setUserPassword(password);

model.addAttribute("status", "success");
model.addAttribute("uservo", uservo);

}else{
model.addAttribute("status", "required");
}

}

-------------------------------------------------------------------------------------------------------------------

Comment For Software Developers

Java Single Line Comments 

public class JavaComments {

// Below is the Main Method
public static void main{
    System.out.println("Java Single Line Comments");
}

}
-------------------------------------------------------------------------------------------------------------------

Java Multi Line Comments

public class JavaComments {

public static void main{
    /* Displaying the out put using SOP
        created on : 03-01-2014
        Author : Naidu
        Class : JavaComments
    System.out.println("Java Multi Line Comments");
}

}
-------------------------------------------------------------------------------------------------------------------

JSP Comments

<%

<%-- JSP Comments --%>

String Uname = Config.getInitParameter("uname");
out.println(Uname);

%>
-------------------------------------------------------------------------------------------------------------------

HTML Comments

<html><head></head><body>
<p>Hi Hope You are doing Good  </p>
<!-- Some Text in the Comments -->
</body></html>
-------------------------------------------------------------------------------------------------------------------

JavaScript Comments

function myObject(){

  var text = 'abcdef';
 
  // Jacascript Comments
  alert(text);

}
-------------------------------------------------------------------------------------------------------------------

Xml File Comments

<xml>

  

  <data>abcd</data>

  <data>vfrt</data>

   //Xml Comments

</xml>

-------------------------------------------------------------------------------------------------------------------

Properties File Comments

########### Cookie Information ###########

#admin.cookie.domain=http://localhost:123456

app.rememberme.cookie.userid = userid

######## session time out in minutes only ########

app.session.sessiontimeout=180

!!!!!!!!!! SMTP  !!!!!!!!!!!!  

smtp.mail.host=smtpout.xyz.abcdef.xyz

-------------------------------------------------------------------------------------------------------------------

Change The Date Rage of one Date Field W.R.T another Date Field

$( "#dateField" ).datepicker({
            changeMonth: true,
            changeYear: true,
            buttonImage: "images/calander.png",
            buttonImageOnly: true,
            yearRange: "-100:+0",
            maxDate: '-1d',   
            dateFormat: "dd-mm-yy",
           
            onSelect: function(dateText)
            {
                document.getElementById("dateFieldError").style.display='none';
                var x=$( "#dob" ).val();
                var y=dateText;
                split_dob = x.split('-');
                var formatted_dob = new Date();
                formatted_dob.setFullYear(split_dob[2], split_dob[1]-1, split_dob[0]);
       
                split_dateField = y.split('-');
                var formatted_dateField = new Date();
                formatted_dateField.setFullYear(split_pid[2], split_pid[1]-1, split_pid[0]);
               
                if(formatted_dob > formatted_dateField)
                {
                    alert("Date cannot be less than birth date.");
                    $( "#dateField" ).val('');
                }
           
            }
        })

Validating Dates in JavaScript

Here we are Validate the Date Fields which are Dependent on each other i.e., The Date selected in one filed will depend on another field

function validateSomeDateField()
{   
    var dateField = document.Form.dateField.value;
    split_dateField = dateField.split('-');
    var formatted_dateField = new Date();
    formatted_dateField.setFullYear(split_pid[2], split_pid[1]-1, split_pid[0]);
   
    var currentDate = new Date();
    if( formatted_dateField >= currentDate )
    {
        alert("Date Cannot Be Future");
        document.Form.dateField.value = '';
        document.Form.dateField.focus();
        return false;
    }
   
    var dateofbirth = document.Form.dateofbirth.value;
    split_dob = dateofbirth.split('-');
    var formatted_dob = new Date();
    formatted_dob.setFullYear(split_dob[2], split_dob[1]-1, split_dob[0]);

    if( formatted_dateField <= formatted_dob )
    {
        alert("Date cannot be less than birth date.");
        document.Form.dateField.value = '';
        document.Form.dateField.focus();
        return false;
    }
    if(formatted_dob >=  formatted_dateField )
    {
        alert("Date cannot be less than birth date.");
        document.Form.dateField.value = '';
        document.Form.dateField.focus();
        return false;
    }
    return true;
}

Adding Data Dynamically To Array and Displaying Them Using JavaScript

<html>
<head>
<title> Dynamic | Data </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
function viewNextMsg() {
    if (messages.length == 0) {
        alert("Empty Array");
    } else {
        $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, viewNextMsg);
    }
};

var messages = [
    "Message 1",
    "Message 2",
    "Message 3",
    "Message 4",
    "Message 5"
].reverse();

$('#message').hide();
viewNextMsg();
</script>
</head>
<body onload="viewNextMsg()">
<p>Here is a message: <span id="message"></span></p>
</body>
</html>

View in JS Fiddle