Why when I change the src of an image with jquery, the the src is not changed in my c# codebehind?

I have a gallery of thumbnails. When you click on a thumbnail, the main image changes to the thumbnail clicked by using jQuery and changing the 'src' tag of the . This works as expected.

$('#ContentPlaceHolder1_photoSpotImage').attr('src', src.replace(/-thumbs/, ''));

I have a link that, when clicked, makes the image a downloadable file using the Content-Disposition methods in the header. When hard-set in the code it works as expected.

<asp:LinkButton runat="server" PostBackUrl="" ID="link2TheDownload" Text="+ download it" onclick="link2TheDownload_Click"></asp:LinkButton>

Now, I have added programmatically in the codebehind get the filename of the selected image from the 'src' tag of the tag.

    string thisServerName = Request.ServerVariables["SERVER_NAME"].ToString();
    string thisHref = "http://" + thisServerName + "/" +photoSpotImage.Src.ToString();
    Uri uri = new Uri(thisHref);
    string filename = Path.GetFileName(uri.LocalPath);
    string thisAttachment = "attachment; filename=" + filename.ToString();
    Response.ContentType = "image/jpeg";
    Response.AppendHeader("Content-Disposition", thisAttachment.ToString());
    Response.TransmitFile(strDirectFilePath.ToString() + "/photos/1/" + filename.T开发者_Python百科oString());
    Response.End();

The C# only has the filename that is initially set Onload and it appears that the jQuery has not changed the src.

I need to get the current filename so I the user can download the proper image file.

Help!

JQuery only manipulates the DOM on the client-side. It won't modify the view state and images aren't included in the POST request. You will have to post back a hidden form field with the correct value.

Yes it's the correct result from your code, it will not update because it's using the rendered html from the server but not the jQuery updated html, this is how it really works, for your adjustment you can just adjust the code in your C# code, like this:

string thisServerName = Request.ServerVariables["SERVER_NAME"].ToString();
photoSpotImage.Src.ToString().Replace("-thumbs", string.Empty);

First, do this on your code-behind:

photoSpotImage.Attributes["data-filename"] = "image.jpg";

Now, this would output something like this on the client-side:

<a id="ContentPlaceHolder1_photoSpotImage" data-filename="image.jpg">Test hyperlink</a>

Because you have the file-name embedded as an attribute of the a-element, you can form the full URL to the file using jQuery:

$('#ContentPlaceHolder1_photoSpotImage').attr('src', $('#ContentPlaceHolder1_photoSpotImage').attr('data-filename')));

You can use "file-path" instead of filename but my above example should give you a general idea.