47234

How to include array content in HTML?

I have this code

var users = result.users; // array $("#dialog:ui-dialog").dialog("destroy"); $("#dialog-confirm").dialog({ resizable: false, height: 140, modal: true, open: function() { $(this).children('div.dialog-text').replaceWith("<b>New text goes here</b>"); }, buttons: { "Okay": function() { $(this).dialog("close"); }, Cancel: function() { is_okay = 0; $(this).dialog("close"); } } });

where the array contain data in the form of

{"ss":"Sandra Schlichting","fn":"Full name"}

What I am trying to accomplish is to get the content of the arrays in the form of (white space inserted for readability)

<table> <tr> <td>Initials</td> <td>Full Name </td> </tr> <tr> <td>ss </td> <td>Sandra Schlichting</td> </tr> <tr> <td>fn </td> <td>Full name </td> </tr> </table>

and have that replaced with <b>New text goes here</b> in

$(this).children('div.dialog-text').replaceWith("<b>New text goes here</b>");

From what I can tell $.each() should be used for this.

But still I can't quite figure out how to get started.

Can anyone help me out?

Answer1:

function makeTable(users) { var result = '<table><tr><td>Initials</td><td>Full Name</td></tr>\n'; $.each(users, function(index, value) { result += '<tr><td>' + index + '</td><td>' + value + '</td></tr>\n'; }); result += '</table>'; return (result); } alert(makeTable({"ss":"Sandra Schlichting","fn":"Full name"}));
    <li>Working here</li> <li>$.each documentation</li> </ul>

    Answer2:

    You can use a JS for-in to loop through it.

    <table id='nameTable'> <tr> <td>Initials</td> <td>Full Name </td> </tr> </table> var names = { "ss": "Sandra Schlichting", "fn": "Full name" }; var $table = $('#nameTable'); var row = ''; for (name in names) { row += '<tr><td>' + name + '</td><td>' + names[name] + '</td></tr>'; } $table.append(row)

    Here's a fiddle : http://jsfiddle.net/exP2b/4/

Recommend

  • AJAX calls only working once
  • Views.player album cover
  • databinding custom directive angular with replacing html in compile function
  • Replace nbsp; with
  • Workaround to making an XMLHttpRequest to api.twitter.com?
  • replaceWith() while elements fadeOut() and fadeIn() in JQuery
  • ReplaceWith image on hover
  • Jquery : How to move TD to another TR?
  • Reset bootstrap modal
  • How to include array content in HTML?
  • Toggle dropdown mini-cart when product added to basket
  • Website flashes between loads
  • Creating a Multi-Step Modal Using Jquery
  • Caliburn Micro, How to use ContentControl (or display 'sub' ViewModel) using ViewModel Fir
  • Perspective projection, 4 points
  • Debug.DrawLine not showing in the GameView
  • How to suppress a dialog
  • Android full screen on only one activity?
  • Cancel a live stream “fast motion” catch-up in Flash
  • FileReader+canvas image loading problem
  • Insert into database using onclick function
  • Deselecting radio buttons while keeping the View Model in synch
  • Optimizing database types to compact database (SQLite)
  • Why HTML5 Canvas with a larger size stretch a drawn line?
  • TFS: Get latest causes slow project reloading
  • MySQL WHERE-condition in procedure ignored
  • Running a C# exe file
  • Adding custom controls to a full screen movie
  • Web-crawler for facebook in python
  • trying to dynamically update Highchart column chart but series undefined
  • embed rChart in Markdown
  • How to get Windows thread pool to call class member function?
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • costura.fody for a dll that references another dll
  • Reading document lines to the user (python)
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • java string with new operator and a literal