Just wanted to add a strange behaviour, I recognized inspecting the
code at runtime with firebug.
When I set a breakpoint in the line after I set the load image ($("img
[name='imageChange']").attr('src',
'load.gif');). The image is correctly displayed and stays after I
continue execution until the end of the operation.
This is the behaviour I want, but when the code is executed without
setting a breakpoint, the line seems to be just skipped?!?
Got no clue...
On 16 Jun., 17:23, "Jens L." <jenslu...@gmail.com> wrote:
> Hey guys,
> i have following problem: When the user on my website presses a image
> link, I prevent the default behaviour, and toggle some table rows
> (show or hide them, depending on the the image src (closed.gif /
> opened.gif)). Since I got a lot of rows I run over and toggle, the
> function takes some time to process and the browser "hangs" in the
> meanwhile. Due to this I want to show the user that the operation is
> still in progress and want to change the image of the link to a load
> spinner until it is finished. So I thought that I just have to change
> the src URL of the image in advance and then start the function, but
> jQuery is ignoring the line and I don't know why?!?
>
> Here is the code I am using:
> $("a[name='changeDisplayModeAll']").click(function(e) {
> e.preventDefault();
> var newStatus;
> var imageSrc = $("img[name='imageChange']").attr('src');
> $("img[name='imageChange']").attr('src',
> 'load.gif'); // Here I want to change to the load image
> var rep = "";
> // check if table rows should be hided or shown
> if(imageSrc.match("closed")) {
> newStatus = "opened";
> rep = imageSrc.replace("closed", "opened");
> } else {
> newStatus = "closed"
> rep = imageSrc.replace("opened", "closed");
> }
> // now the long-lasting function
> // remark: i get the ids for the table row from a
> select box where all projects (which i want to
> // show /hide) are listed with id which i need to
> identify the table rows
> $("#editProject > *").each(function() {
> var projectId = $(this).val();
> if(projectId && projectId != '-1') {
> var image = $("img[name='image_" + projectId
> + "']").attr('src');
> var statusChanged = false;
> if(image) {
> if(image.match("closed") && newStatus
> == "opened") {
> statusChanged = true;
> rep = image.replace("closed",
> "opened");
> $("img[name='image_" +
> projectId + "']").attr('src', rep);
> $.cookies.set('tree' +
> projectId, 'on');
> }
> if(image.match("opened") && newStatus
> == "closed") {
> statusChanged = true;
> rep = image.replace("opened",
> "closed");
> $("img[name='image_" +
> projectId + "']").attr('src', rep);
> $.cookies.set('tree' +
> projectId, 'off');
> }
> if(statusChanged) {
>
> $("tr[title='projectScenarios_" + projectId + "']").each(function
> (i) {
> $(this).toggle();
> });
> $("tr[title='scenariosCases_"
> + projectId + "']").each(function
> (i) {
> $(this).toggle();
> });
> }
> }
> }
> });
> // now return to the old image
> $("img[name='imageChange']").attr('src', rep);
> });
>
> Hope someone could help me with this issue.
> Thanks in advance,
> Jens
