last day (14 days later) » 

7:11 AM
3
A: How to append data to table using jquery

vijayPYou can dynamically clone the first row present in tbody and then append it back in table with newer row data like this: $(document).ready(function() { var testData = [{ "ProductName": "AAA", "NoOfCarton": 10 }, { "ProductName": "BBB", "NoOfCarton": 20 }]; $...

 
It's working as expected, but the problem is it's working for only first time. I've numbers of button in my grid, when user click on first then data came accordingly, but if user clicked on second time on other button then it's displaying test test
 
@user6689472 - could you please try now. I have updated the answer and added one line just before $.each(testData,. Please try that in your code.
 
No luck, displaying same test test
 
I can't guess what would be wrong at your end. Is it possible to create a fiddle or snippet here which will show the issue you are facing?
 
Note: I'm doing this on an ajax success, and need to bind each time new data.
 
7:11 AM
So for demo purpose on each button click we can use var testData and var testData_1 and so on. Can you create demo such like this?
 
Is it possible to create a fiddle or snippet Actually, I've repeater control for orders and and each row has a button, when user click on button then accordingly orderId fetch data from database and bind to the table.
Can you create demo such like this? let me try.
I've tried to create demo, in which i take 2 buttons and passed different data on click, but it's working totally fine.
How can I check now, can you please give me suggestion, I'm stuck!
 
hello
could you please update your question to put newer code that you have written in ajax success handler.
 
7:27 AM
Okay. let me update it in the question
@vijayP, Question Updated
 
8:17 AM
hello. sorry. i think i confused you. I wanted to see the updated JavaScript code.
 
which one ?
 
you must have modified `success: function (data) {
$.each(data, function (i, v) {` code. Can you please update that one in your question.
 
Okay sure.
 
8:34 AM
ok..so are you getting any js error in browser console?
 
No.
 
can you put alert(data.length); as very first statement in success: function (data) { and see what count you get for 2 different requests?
 
Okay, I try and will let you know shortly
 
ok please
 
It's 1 for all
 
8:45 AM
ok..now comment entire $.each( loop which is setting the data and see what you get. In this case you should get only one row below your table header.
 
Yes, I comment $.each loop and run the app it's shows one row
with test record data
 
ok..can you confirm that: the $.each loop code works perfectly for first button click?
and it breaks for 2nd button click?
 
I've tried to debug code. $.each loop code works perfectly for first button click? it's working properly for both
 
9:02 AM
ok..so where is the issue now?
can you please take a screenshot of error and post it in question
 
Screen added
 
seems like our 2nd order 0000013 doesn't have any product details hence its not going into $.each loop and not setting up the data
 
No, It has data.
In fact for all others it's displaying test, only for first displayed properly!
 
looks like you have problem with your HTML. You have master level table for showing Order number, order amount etc. Now within that you have child level table to show product rows. So each order number row should have its own child level table with class tableOrderDetail (we can't duplicate id in single document). Right now its hitting the same child level table because of $("#tableOrderDetail tbody").
 
9:23 AM
Yes, You're right thanks anyway! to investigating such whole thing and your time of course
 
glad to help you. I hope you will be able to fix it soon...!
 

last day (14 days later) »