0

I've a live insert form which is supposed to append to a table the value if it's actually inserted in the database.

So, I have this javascript/jquery function:

    else{
        var data = 'action=insert&porcab=' + porcAbandoned + '&porcan=' + porcAnswered;
        data = data + '&secab=' + secAbandoned + '&secan=' + secAnswered + '&name=' + name;
        $.ajax({
        type: "POST",
        url: "manager.php",
        async: false,
        data: data,
        cache: false,
        success: function(response){
                    var result = Number(response);
                    var row = '<tr id="'+result+'"><td class="edit porcAbandoned '+result+'>'+name+'</td>';
                    row = row + '<td style="text-align: center;" class="edit porcAbandoned '+result+'>'+porcAbandoned+' %</td>';
                    row = row + '<td style="text-align: center;" class="edit secAbandoned '+result+'>'+secAbandoned+'</td>';
                    row = row + '<td style="text-align: center;" class="edit porcAnswered '+result+'>'+porcAnswered+' %</td>';
                    row = row + '<td style="text-align: center;" class="edit secAnswered '+result+'>'+secAnswered+'</td>';
                    row = row + '<td style="text-align: center;">-</td>';
                    row = row + '<td style="text-align: center;"><a class="delete" href="#"><img src="assets/delete.png" /></a></td></tr>';
                    $('#clients > tbody:last').append(row);
                }
        });
    }

The previous IF is just the validation. If it doesn't validate doesn't perform the AJAX call.

I've tried to alert the row and the data stored is correct but it doesn't show any data in the table but the score and the image...

The response returned is the ID of the table inserted so it could be deleted.

What's wrong with that?

Antonio Laguna
  • 8,973
  • 7
  • 36
  • 72
  • I think there is a "new" keyword in the following row missing: var result = Number(response); – Tim Büthe May 31 '11 at 07:10
  • I don't understand what are you trying to tell me :( Number forces the conversion to a Number of the response. – Antonio Laguna May 31 '11 at 07:12
  • You have to write "new Number(...)". Always write "new" when using a constructor. A constructor, by convention, starts with in upper case letter. Normal functions with a lower case. – Tim Büthe May 31 '11 at 07:20
  • Okay, but this doesn't solve the issue. As I said, the output at row alert is okay but isn't show properly. – Antonio Laguna May 31 '11 at 07:22
  • Maybe I was wrong on the Number constructor. Seems to be an exception, look here: http://stackoverflow.com/questions/369220/why-should-you-not-use-number-as-a-constructor. However, you are right, thet doesn't solve the problem. – Tim Büthe May 31 '11 at 07:34
  • This stripped down version works fine: http://jsfiddle.net/timbuethe/qqNGc/1/. Maybe you can fork and extend this fiddle so we could debug this together. – Tim Büthe May 31 '11 at 07:36
  • You should add your HTML and I would add an `alert($('#clients > tbody:last').length)` to see if the jQuery selector matches something. – Tim Büthe May 31 '11 at 07:37

2 Answers2

0

What about this test jsfiddle. This works and adds a row. However, the used variables must be handed to the functions using the "context" property, see here: jQuery.ajax

Tim Büthe
  • 62,884
  • 17
  • 92
  • 129
  • I don't know what do you mean with that. The variables are within the form.submit(function()) and it does insert the value and also alert the row correctly. – Antonio Laguna May 31 '11 at 07:56
0

You didn't close the class attribute, f.ex:

row = row + '<td style="text-align: center;" class="edit porcAbandoned '+result+'>'+porcAbandoned+' %</td>';

is:

row = row + '<td style="text-align: center;" class="edit porcAbandoned '+result+'">'+porcAbandoned+' %</td>';
________________________________________________________________________________/\
Pyronhell
  • 66
  • 6