Hi ,

In my application, there is a view page to show the table of Attributes name as the header and its value filled by many people below. Like

Name Age salary
a 22 18912
b 23 89972
c 23 781273

i want it like above ..
But i am getting it as

Name Age Salary
a 22 18912 b 23 89972 23 781273

I am using JQuery to retrieve these values from my Mysql table and from my Cakephp controller code to view it ..

<head>
  <script type="text/javascript">
    $(document).ready(function(){
      var ht = $.ajax({
        type: "GET",
        url: "http://localhost/FormBuilder/index.php/admins/viewEntries/"+formid,
        async: false
      }).responseText;
      var myObject = eval('(' + ht + ')');
      var data = myObject;var last;
      $.map(data.labels, function(i){
        last=i.label;
        $("<th>"+i.label+"</th> ").appendTo("#headers");
      return i.label;});

      var htm = $.ajax({
        type: "GET",
        url: "http://localhost/FormBuilder/index.php/admins/viewResults/"+formid,
        async: false
      }).responseText;
      var myObject1 = eval('(' + htm + ')');
      var data1 = myObject1;
      $.map(data1.values, function(i){
        $("<td>"+i.value+"</td> ").appendTo("#body");
        if(last==i.label){
          // where i thought to create a new row for 2 row
        }
      return i.value;});
    });
  </script>
</head>
</body>
  <table class="entries" cellspacing="0" cellpadding="3" border="1">
    <tr id="headers"></tr>
    <tr id="body"></tr>
  </table>
</body>

How to make a new row to display the 2nd and 3rd row values in the new row..Please suggest me.....

Arunajasmine,

I agree with lordSpace that composing the table server-side would be the easiest thing if (a) the server-side script is under your control and (b) you don't need to access the tabulated values for any other purpose.

If you want/need to build the table client-side then try this:

var data1 = eval('(' + htm + ')');//You could avoid eval by using JSON
	var tr, row;
	for(var i=0; i<data1.values.length; i+=3){
		tr = document.createElement('tr');
		row = data1.values.slice(i, i+3);
		$.map(row, function(n){//use n here to avoid confusion with loop counter i
			var td = document.createElement('td');
			td.appendChild(document.createTextNode(n.value));
			tr.appendChild(td);
			return n.value;//probably not necessary
		});
		$("#body").append(tr);
	}

I've not been able to test so it probably needs debugging but the overall structure should be OK. I think tr is still in scope inside $.map's callback fn.

Airshow

Thanks your code works good what i expect to be.

Arunajasmine,

I agree with lordSpace that composing the table server-side would be the easiest thing if (a) the server-side script is under your control and (b) you don't need to access the tabulated values for any other purpose.

If you want/need to build the table client-side then try this:

var data1 = eval('(' + htm + ')');//You could avoid eval by using JSON
	var tr, row;
	for(var i=0; i<data1.values.length; i+=3){
		tr = document.createElement('tr');
		row = data1.values.slice(i, i+3);
		$.map(row, function(n){//use n here to avoid confusion with loop counter i
			var td = document.createElement('td');
			td.appendChild(document.createTextNode(n.value));
			tr.appendChild(td);
			return n.value;//probably not necessary
		});
		$("#body").append(tr);
	}

I've not been able to test so it probably needs debugging but the overall structure should be OK. I think tr is still in scope inside $.map's callback fn.

Airshow

This article has been dead for over six months. Start a new discussion instead.