Get the row changed in repeater

Question

Hey, I've got a repeater which is placed inside an updatepanel. When the user enters a new value, the repeater is updated without a postback. Is it possible to get the row that was updated in JQuery so that I can place an effect on it to make the change less subtle? For example, I'd like to fade a new color in on just the row that was changed.

Thanks

Answer 1

It's easy enough to make a callback to some JS on the page using the ScriptManager. This code has worked for me inside of an event handler for an event I received through an updatepanel.

ScriptManager.RegisterStartupScript(Me, Me.GetType(), "someKey", "someFunc();", True)

The key isn't as important in this case, but that'll kick off the someFunc JS function on the page. If you can tag a CSS class on the rows that are being updated, you could define a function that does a jQuery highlight effect on those rows. I think that'd be the approach I'd take.

The string there of "someFunc();" gets executed, and the True after it wraps it in proper script tags so you don't have to. I've also used it (for specific purposes) to do things like pop open a new window, like so:

ScriptManager.RegisterStartupScript(Me, Me.GetType(), "viewReport", "window.open('" + reportURL + "','_blank');", True)

That happens in a Button.Click event which lives inside of an updatepanel, so they can click the "View Report" button and it pops it in a separate window, without doing a full page refresh.

Hope this helps or you can find a way to work with it. :)

Answer 2

I am assuming that you have a textbox or some control of some sort causing the postback in the UpdatePanel. If so then you can use the endrequesthandler and use Jquery to get the row and animate it:

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);

function endRequestHandler(sender, args){
     $("#" + sender._postBackSettings.sourceElement.id).parents("tr").animate(....);
}

or jQuery 1.4.2

function endRequestHandler(sender, args){
     $("#" + sender._postBackSettings.sourceElement.id).parentsUntil("table").animate(....);
}

Hope this helps

Update: Might want to filter by a CSS class or something, unless you want it to happen to ALL postback items in a table

Answer 3

Thanks for the replies. I managed to solve the problem by storing a list of the things the user changed before submitting, and then searching for those items after the updatepanel update. Whenever an item was found, that row was updated.