Javascript / JQuery Append the return of a function in a concatenated string

Question

I have a function that returns a string:

function buildCell(){
     var returnString = '';
     returnString += '<td>';
     returnString += 'Cell Contents';
     returnString += '</td>';
     return(returnString);
}

I have another function that should invoke the first string and return its value inline:

function buildTable(){
    $('body').html(
         '<table>'
         +'<tr>'
         + buildCell()
         +'</tr>'
    )
}

My table doesn't have the cell, the cell comes back undefined. How do i properly concatenate the return of the first function in the second?

Edit: I removed the semicolon and still receive "undefined". When I place an alert in the first function I see the correct value in the alert, but it is still undefined in the second function.

You have incorrectly placed semi-colons inside buildTable function > buildCell(); — elad.chen, Jun 24 '16 at 19:50
You mean a cell isn't added ? or you're expecting buildTable to return something other than undefined ? — elad.chen, Jun 24 '16 at 19:56
Yes, the cell is not added, just the text "undefined" when I Inspect Element — user1955162, Jun 24 '16 at 19:56
Please have another look at my answer. I included a snippet which clearly works. — elad.chen, Jun 24 '16 at 20:01
Who is calling `buildTable` can you post that please. I dont get any undefined in this example http://jsbin.com/xagidonepo/edit?html,css,js,output which is pretty much what @elad.chen did — Yordis Prieto Lazo, Jun 24 '16 at 20:04
Questions *seeking debugging help ("why isn't this code working?")* **must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself**. Questions without a clear problem statement are not useful to other readers. - Your question currently does not provide code that recreates the problem. — Kevin B, Jun 24 '16 at 20:06
In your question, put the alert in your code snippet where it shows undefined. Talking about code you don't put in your question can never be as precise as just including it to the letter. — trincot, Jun 24 '16 at 20:07

elad.chen · Accepted Answer · 2016-06-24T20:06:09.077

1

You have incorrectly placed semi-colons inside buildTable function > buildCell();

Change your function from this:

function buildTable(){
    $('body').html(
         '<table>'
         +'<tr>'
         + buildCell(); // <---
         +'</tr>'
    )
}

To this:

function buildTable() {
    return $('body').html('<table>' + '<tr>' + buildCell() + '</tr>');
}

https://jsfiddle.net/k0ageq81/

function buildCell() {
  var returnString = '';
  returnString += '<td>';
  returnString += 'Cell Contents';
  returnString += '</td>';
  return returnString;
}

function buildTable() {
  return $('body').html('<table>' + '<tr>' + buildCell() + '</tr>');
}

buildTable();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

edited Jun 24 '16 at 20:06

answered Jun 24 '16 at 19:52

elad.chen

2,375
5
25
37

your snippet works but in the code you posted above this semicolon is incorrect and wouldn't work. – derloopkat Jun 24 '16 at 20:03
You know what. You edited you answer. Previously you have posted this. "try this" function buildTable(){ $('body').html( '' +'' + buildCell() +''; // <--- ) }
– derloopkat Jun 24 '16 at 20:15
I was convinced you saw the edit, hence the confusion. – elad.chen Jun 24 '16 at 20:29
FYI your edit can be seen here. http://stackoverflow.com/posts/38021127/revisions – derloopkat Jun 24 '16 at 20:45
According to the timestamp my edit was performed ~3 minutes before your comment. – elad.chen Jun 25 '16 at 00:13
Nope, my comment was at 20:03 and you amended your mistake at 20:06. – derloopkat Jun 25 '16 at 01:12

score 1 · Answer 2 · answered Jun 24 '16 at 20:08

This works:

  <body>
    <script>
      function buildCell() {
        var returnString = '';
        returnString += '<td>';
        returnString += 'Cell Contents';
        returnString += '</td>';
        return(returnString);
      }
      function buildTable(){
        $('body').html(
          '<table>'
          +'<tr>'
          + buildCell()
          +'</tr>'
        );
      }
      buildTable();
    </script>
  </body>

Javascript / JQuery Append the return of a function in a concatenated string

2 Answers2