I need the correct jQuery syntax to change an image

I have images in a jqGrid and need to reset the image to empty when resetting the row. But I am having a hard time with the syntax for getting and setting the image's path.

I have the id of the image which is unique on the page. The jqGrid is called "samples".

Please look at the code below for an idea of what I am trying to do and suggest a better syntax, since this does not work at all.

Thanks,
newbieweb
var imageField = $('#samples img[id='+imageId+']');
if ( $(imageField).src.substr(imageField.src.lastIndexOf('/')+1) != "empty.gif" ) 
{ 
     $(imageField).src = "~/Content/images/empty.gif";
}

Open in new window

newbiewebSr. Software EngineerAsked:
Who is Participating?
 
HainKurtConnect With a Mentor Sr. System AnalystCommented:
so, final syntax

var imageField = $('#samples img[id='+imageId+']');
if ( imageField.attr("src").substr(imageField.attr("src").lastIndexOf('/')+1) != "empty.gif" ) {
 imageField.attr("src","~/Content/images/empty.gif");
}
0
 
HainKurtSr. System AnalystCommented:
just use

var imageField = $('#samples img[id='+imageId+']');
-->
var imageField = $('#'+imageId);
0
 
newbiewebSr. Software EngineerAuthor Commented:
you mean the following?

var imageField = $('#'+imageId);

then...
if ( $(imageField).src.substr(imageField.src.lastIndexOf('/')+1) != "empty.gif" )
{
     $(imageField).src = "~/Content/images/empty.gif";
}

or...
if ( imageField.src.substr(imageField.src.lastIndexOf('/')+1) != "empty.gif" )
{
     imageField.src = "~/Content/images/empty.gif";
}
0
Cloud Class® Course: Ruby Fundamentals

This course will introduce you to Ruby, as well as teach you about classes, methods, variables, data structures, loops, enumerable methods, and finishing touches.

 
HainKurtSr. System AnalystCommented:
this is also fine!

var imageField = $('#samples [id='+imageId+']');
0
 
HainKurtSr. System AnalystCommented:
also this is fine

var imageField = $('#samples img[id='+imageId+']');

I dont understand where is your problem :)
0
 
HainKurtSr. System AnalystCommented:
this should do

  alert(imageField.attr("src"));
  if ( imageField.attr("src").substr(imageField.attr("src").lastIndexOf('/')+1) != "empty.gif" ) {
     $(imageField).src = "~/Content/images/empty.gif";
  }
0
 
newbiewebSr. Software EngineerAuthor Commented:
Oh, my syntax was okay?

Maybe it's in my use of the following?

 $(imageField).src

I also tried:

imageField.src

with no success
0
 
newbiewebSr. Software EngineerAuthor Commented:
Ok, I will try that and let you know in a minute...
0
 
HainKurtSr. System AnalystCommented:
your issue is not to find the image, but to get the src attribute :) which I posted above...
0
 
HainKurtSr. System AnalystCommented:
or no jQuery, simple javascript will do the same


  alert(document.getElementById(imageId).src);
0
 
HainKurtSr. System AnalystCommented:
also you should use

$(imageField).src = "~/Content/images/empty.gif";
-->
imageField.attr("src", "~/Content/images/empty.gif");
0
 
HainKurtConnect With a Mentor Sr. System AnalystCommented:
one more issue... ~ does not work on clientside (unless you really have a folder with name ~)

you should use

 imageField.attr("src","/Content/images/empty.gif");
0
 
newbiewebSr. Software EngineerAuthor Commented:
Thanks! Unfortunately the web service is down and I can not test this code. But it looks great. Thanks!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.