Hi,I know PHP. I dont know javascript and IM having a heck of a time getting something to work.I know what the issue is. I dont know how to fix it.

I have a table with students that registered to attend a training.On each row there are three form buttons. One says ABSENT, one says FAILED, the other says PASSED.This table will display up to 25 rows at a time.

I want the instructor to press one of the buttons for each student and not refresh the entire page. At the same time UPDATE the row in MySQL/PHP.This part works and its done.The issue I am having is that after the button is pressed, the button is supposed to dissapear and replace the button with text that says, ABSENT, FAILED, Or PAssed(text depending on what is clicked)

The problem is one the first row, all is fine. Instructor presses ABSENT BUTTON, button refreshes to display ABSENT, (NO BUTTON). JUST TEXT.

Once I do the second row, it modifies the record properly in the db, however the button stays there and the text gets displayed on ROW 1. Not Row 2. SEE ATTACHED IMAGE

As mentioned, the database gets updated fine. The only issue is the result is displaying on table row one becasue there is nothing telling it where to update.

OK Thanks,Question for you though. The table is created dynamically so I can easily increment each form number by one. However how do you target the specific row you are clicking in. The target definition is in the header javascript before the form numbers are even created.

The table is created dynamically so I can easily increment each form number by one. However how do you target the specific row you are clicking in. The target definition is in the header javascript before the form numbers are even created.

As long as each row contains 1 form (or rather, as long as each form has a parent element that also contains the target div), then we can change this quite easily.

It's also important that you change your showData div to use a class. In fact everything in your page that has an ID, should be a unique ID, so if you are using IDs in a loop, you need to either prefix/postfix them or use classes if the ID isn't really required

xeonman13
—
2012-11-16T14:13:00Z —
#6

Ok I REALLY appreciate your help and patience.Like I said, I dont know JAVASCRIPT at all.I understand most of what you are saying, but I have played around with all kinds of combinations and the only thing I have gotten is the following.

IT WORKS BUT IT REFRESHES ALL ROWS with the response, not just the row i click on.

Ok I REALLY appreciate your help and patience.Like I said, I dont know JAVASCRIPT at all. I understand most of what you are saying, but I have played around with all kinds of combinations and the only thing I have gotten is the following.

IT WORKS BUT IT REFRESHES ALL ROWS with the response, not just the row i click on.

THANKS AGAIN!

Ok so in your code you made a few mistakes when you were looking at my example.

Firstly, probably the most important thing to do is close all the showData divs, since you are not closing them, the first one would simply encapsulate the rest of the document.

Next up, all your showData divs need to have a class of "showData" NOT "attendanceForm".

The attendanceForm class ONLY goes on the form.

Do you actually want the form to be replaced when someone clicks one of the buttons? If so, your code is mostly fine, you just need to make sure the showData divs are closed at the end of each form

You need to make sure that you place the beforeSerialize method in the ajaxForm options. Like so (You probably don't need the success callback you have in there at the moment):