jQyery output is object Object restful web application : I have been working with an application that i have to use JQuery.
And i have an issue my fucntions related to sons and grandsons in my below mentioned code:


If i type into my browser http://localhost:8080/fathers


I get :

 >[{"id":1,"fname":"fname","lname":"lname","sons":[{"id":1,"fname":"fname","lname":"lname","grandsons":[{"id":1,"fname":"fname","lname":"lname"}]}]
	
My java classes:

	private int id;
    private String fname;
    private String lname;
    private Set<Son> sons = new HashSet<>();
	public AppProduct(int id, String fname , String lname) {
        this.id = id;
        this.fname = fname;
        this.lname = lname;
       
    }
	
	My Son class:
	
	private int id;
    private String fname;
    private String lname;
    private Set<Grandson> grandsons = new HashSet<>();
	public AppProduct(int id, String fname , String lname) {
        this.id = id;
        this.fname = fname;
        this.lname = lname;
       
    }

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

	$.getJSON("http://localhost:8080/fathers",  function(data)
			{
				for (var i in data) {
					$('#tag').append("<p>ID: " + data[i].id + "</p>")
					$('#tag').append("<p>First Name: " + data[i].fname + "</p>")
					$('#tag').append("<p>Last Name: " + data[i].lname + "</p>")
					$('#tag').append("<p>sons: " + data[i].sons + "</p>")
					$('#tag').append("<p>sons: " + data[i].grandsons + "</p>")
					
				}
			});
			
	
			
With my current $.getJSON i get the following output:

for sons:[objtct Object]
for grandsons: undefined
		


			function create()
		{
			var family = {
				id: document.getElementById("id").value,
				fname: document.getElementById("fname").value,
				lname: document.getElementById("lname").value,
                sons: document.getElementById("sons").value,
                grandsons: document.getElementById("grandsons").value
				
			}
			
			
			$.ajax({
				url: "http://localhost:8080/fathers", 
				headers: {
					'Accept': 'application/json',
					'Content-Type': 'application/json'
				},
				type: "POST",
				dataType: "json",
				data: JSON.stringify(family)
			});
		}
		

And for the same reason this part doesnot work in create()

    sons: document.getElementById("sons").value,
    grandsons: document.getElementById("grandsons").value