Need Help Setting <img> src attribute - JavaScript Discussion Boards

Re: attr disabled property is not working for FF

Graham Breach12-Feb-12 22:46

12-Feb-12 22:46

I suspect the problem is somewhere else. $('#id').attr('disabled',true) is working for me in FireFox, IE, Chrome and Opera. Setting it back to 'false' enables the inputs again.

Re: attr disabled property is not working for FF

Mohibur Rashid14-Feb-12 5:53

Mohibur Rashid

14-Feb-12 5:53

I agree with graham
I tested with

below code:

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<div>
<input type='checkbox' value='10' id='id'> <label for='id'>Test Checkbox</label>
</div>

<BUTTON onclick='a=!($("#id").attr("disabled")); $("#id").attr("disabled",a)'>
test
</BUTTON>

it work fine

Re: attr disabled property is not working for FF

ramuAlla1-Mar-12 1:15

ramuAlla

1-Mar-12 1:15

If I will use <asp:button ...=""> and <asp: checkbox...=""> ....How can I disable checkbox

Re: attr disabled property is not working for FF

Ed Nutting19-Feb-12 0:34

Ed Nutting

19-Feb-12 0:34

The code you are using has always worked for me so not sure what's wrong but as a point, the second one in your list is the correct one. If you are trying to enable the check boxes again you will have to use the removeAttr method as W3 standards say that the mere presence of the disabled attribute means the control is disabled, regardless of value (which some of the major browsers follow).

As for why your check boxes don't disable I can only suggest that IE and FF are handling your HTML differently (check Id's are the same, that you are only trying to set the disabled attribute after full page load (use $(document).ready if you aren't!) etc. etc.)

Hope this helps,
Ed

How can i use backbone.js

DeepthiTanguturi10-Feb-12 22:02

DeepthiTanguturi

10-Feb-12 22:02

How can i use backbone.js.What is the purpose of backbone.js.Post some sample code.Actually i tried on google.I am not getting correct solution.

Re: How can i use backbone.js

Richard MacCutchan10-Feb-12 23:50

Richard MacCutchan

10-Feb-12 23:50

DeepthiTanguturi wrote:
Actually i tried on google.

And you couldn't find this[^]?

Unrequited desire is character building. OriginalGriff
I'm sitting here giving you a standing ovation - Len Goodman

page loading

Member 79044828-Feb-12 20:22

Member 7904482

8-Feb-12 20:22

hi
how I can create menu like this (when click on it, opens and show its description:
http://www.codeproject.com/Forums/1580226/JavaScript.aspx

but I want when I click on menu it loads an image under itself
please help me
thanks alot

modified 9-Feb-12 5:23am.

Need Help Setting <img> src attribute

PianoMan7-Feb-12 5:26

PianoMan

7-Feb-12 5:26

I've hit a wall trying to use javascript to write a table with some image tags. I'm looping through an array of image names, then setting their src attribute. The function is creating the tags, but all that displays is the 'missing image' thumbnail. The function is fired via a button. Below is my code.

Thanks!

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional/EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex">

<title>Testing Javascript</title>

<script type="text/javascript">

function getImages() {

// Declare variables
var allImages, vRow, vCell, vText, vImg;
var vCnt, i, j, x, y;
var vTable = document.createElement("TABLE");
var vTBody = document.createElement("TBODY");

// Insert vBody into vTable
vTable.appendChild(vTBody);

// create an array
var images = new Array();

images[0] = "image1.jpg";
images[1] = "image2.jpg";
images[2] = "image3.jpg";

// count values in the array
vCnt = images.length;

  // loop through the array of images and answers
  for (i=0; i < vCnt; i++)
  {
	// create a row
	vRow = document.createElement("TR");

	// create a TD tag
	vCell = document.createElement("TD");

	// create IMG element
	var image = images[i];
	vImg = document.createElement("IMG");
	vImg.setAttribute("src", "images/" + image);

	// insert the img tag into the td tag
	vCell.appendChild(vImg);

	// insert the cell into the row
	vRow.appendChild(vCell);

	// insert the row into the table
	vTBody.appendChild(vRow);
  }

// add the table to the doc
var vTableContainer = document.getElementById("vTableContainer");
vTableContainer.appendChild(vTable);
}
// end updatePage()
</script>
</head>

<body bgcolor = "#FFFFFF">
<h2>Javascript and Images</h2>

<div id="parentDiv">

<p>
Trying to set the image source with js...
</p>

<div id="childDiv">

<form method="GET">
<input type="button" value="DISPLAY IMAGES" onClick="getImages();" />
</form>

</div>

<div id="vTableContainer"></div>

</div>
</body>
</html>

Re: Need Help Setting src attribute

Dean Oliver7-Feb-12 6:40

Dean Oliver

7-Feb-12 6:40

Hi you can either do it the standard way as it is shown in this article
http://reference.sitepoint.com/javascript/Element/setAttribute[^]
Or I suggest you rather use the jquery api. it's alot easier for manipulating tags etc; It'll make your life far easier.
http://api.jquery.com/attr/[^]
Here's an excellent beginner's guide.
http://www.shopdev.co.uk/blog/jquery-from-scratch-a-beginners-guide/[^]
Hope this all helps.

Re: Need Help Setting src attribute

PianoMan7-Feb-12 16:24

PianoMan

7-Feb-12 16:24

Dean, Thanks for the reply. I've been working with the jquery api just a bit today, and I really like it. Thanks for the reference!

Re: Need Help Setting src attribute

Dean Oliver7-Feb-12 21:56

Dean Oliver

7-Feb-12 21:56

Please vote if you found my answer useful.

thanks Smile | :)

Re: Need Help Setting src attribute

Mohibur Rashid7-Feb-12 18:12

Mohibur Rashid

7-Feb-12 18:12

I just checked about setAttribute. It seems that only Firefox implemented it properly.

JQuery is a very good choice. for your information you can also use

imgobject.src='my/image/source.jpg'; //it will do fine Smile | :)

Re: Need Help Setting src attribute

twseitex19-Feb-12 2:50

twseitex

19-Feb-12 2:50

(1) Please don't use names of collections for private vars

so var images = new Array();
better var arArrayOfImagesObjects=new Array();

images is al pre-dfined collection: document.images

see http://msdn.microsoft.com/en-us/library/ms537461.aspx

(2) To set scr:

valueof .src is not same like pure string

preload image

var imgObjekt1=new Image(); // height and width if you want
imgObjekt1.src='whatYouWant.jpg'; // maybe with path

vImg = document.createElement("IMG"); // check pionter !
if(vImg!=null)
{
// append into object (into child of body) // append into collection images automatically
// check pointer of appended object, use e.g. var imgAppendedImgObject

if(imgAppendedImgObject!=null)
{imgAppendedImgObject.src=imgObjekt1.src; // will be (now) rendered in body
// don't use setAttribute("src", "images/" + image);
}
}

(3) FIRST optimize your code during edit and THEN check errors at run time.

to createElement and appendChild

check always pointers != null

if you use a collection like images check too

declare vars inside of function --> local vars

declare vars inside of for{} --> declare 1 time outside of for and use inside

declare constants like "image1.jpg" outside of function --> use global code e.g. at begin of js-file (easy find and edit in js-file).

Images Won't display in IE 7

PianoMan5-Feb-12 6:27

PianoMan

5-Feb-12 6:27

Would someone please tell me why this js won't display images in IE 7, but works perfectly in Firefox? I'm using Windows XP, and I've double-checked all my settings in IE 7. Thanks!

XML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Sample</TITLE>

<SCRIPT LANGUAGE="JavaScript">
window.onload = fnWrite;

function fnWrite()
{
  // Declare variables
  var vTable = document.createElement("TABLE");
  var vTBody = document.createElement("TBODY");
  var vRow, vCell, vDiv, vImg;
  var i;

  var images = new Array();
  images[0] = "images/treble_f1.JPG";
  images[1] = "images/treble_c1.JPG";
  images[2] = "images/treble_d1.JPG";
  images[3] = "images/treble_e1.JPG";

  // Insert vBody into vTable
  vTable.appendChild(vTBody);

  // Insert a row
  vRow = document.createElement("TR");
  vTBody.appendChild(vRow);
  vCell = document.createElement("TD");
  vRow.appendChild(vCell);

  // Insert images
  for (i=0; i<images.length; i++)
  {
    vDiv = document.createElement("DIV");
    vCell.appendChild(vDiv);

    vImg = document.createElement("IMG");
    vImg.src = images[i];
    vImg.setAttribute("alt", "image");
    vCell.appendChild(vImg);
  }
  // Insert the table
  vTableContainer.appendChild(vTable);
}
</SCRIPT>

</HEAD>
<BODY>
<H1>Javascript Won't Work in IE 7</H1>
<div id="vTableContainer"></div>

</BODY>
</HTML>

Re: Images Won't display in IE 7

Richard MacCutchan5-Feb-12 23:23

Richard MacCutchan

5-Feb-12 23:23

Try moving the line

JavaScript

window.onload = fnWrite;

after the fnWrite() function block.

Unrequited desire is character building. OriginalGriff
I'm sitting here giving you a standing ovation - Len Goodman

Re: Images Won't display in IE 7

PianoMan6-Feb-12 4:15

PianoMan

6-Feb-12 4:15

Thanks for the reply, however that did not fix this problem. The IE browser does display the little thumbnail box, which tells me the image tag is there, but this line of code
vImg.src = images[i];
for some reason is not setting the source for the image. I've even tried hard coding in the source with no luck.

Re: Images Won't display in IE 7

Richard MacCutchan6-Feb-12 4:30

Richard MacCutchan

6-Feb-12 4:30

Sorry, it was a bit of a stab in the dark, but I know that there are some strange inconsistencies between IE and the other browsers.

Unrequited desire is character building. OriginalGriff
I'm sitting here giving you a standing ovation - Len Goodman

Re: Images Won't display in IE 7 - SOLVED

PianoMan6-Feb-12 4:43

PianoMan

6-Feb-12 4:43

Thanks for the reply. Well, I removed the javascript from the HTML page and put it in a js file, and now it works. Go figure... Thanks a lot, Microsoft. Frown | :(

Re: Images Won't display in IE 7 - SOLVED

Richard MacCutchan6-Feb-12 5:31

Richard MacCutchan

6-Feb-12 5:31

This[^] may help explain things.

Unrequited desire is character building. OriginalGriff
I'm sitting here giving you a standing ovation - Len Goodman

Re: Images Won't display in IE 7

jsc4214-Feb-12 3:41

jsc42

14-Feb-12 3:41

I've just tried your code with MS-IE7 on WXP and it works for me! I have a similar problem with code generated on the fly and displayed using IE.navigate using automation - the images come up with the red [x] box or the 4 symbol box but if I show the source, save it, run the saved version the images come up correctly. Are you using IE automation or simple file opening?

Re: Images Won't display in IE 7

twseitex19-Feb-12 2:59

twseitex

19-Feb-12 2:59

A massive problem of Microsoft

If you want reders animated gifs then that will by chrashed by Internet Explorer
preload img with '?' after suffix (:gif?) have no result: animated gif even not rendered.

e.g.

// X00 is an existing image object
// X01 is an existing preloaded image object with filled .src of an animated gif

X00.src=X01.src+'?'; // only if IE exists
X00.src=X01.src; // for opera etc.

preload image

var imgObjekt1=new Image(); // height and width if you want
imgObjekt1.src='animated.gif'; // maybe with path, but not with '?'

vImg = document.createElement("IMG"); // check pionter !
if(vImg!=null)
{
// append into object (into child of body) // append into collection images automatically
// check pointer of appended object, use e.g. var imgAppendedImgObject

if(imgAppendedImgObject!=null)
{imgAppendedImgObject.src=imgObjekt1.src+'?'; // will be (now) rendered in body in IE
}
}

Problem with args.isValid in JS

dayakar_dn1-Feb-12 22:14

dayakar_dn

1-Feb-12 22:14

Hi,

i am not able set the args.isValid as false for JS function...which is not having custom validator..

find the code below:

XML

<asp:LinkButton runat="server"  ID="btnApply" TabIndex="1"  CssClass=" primary"  OnClientClick = "return ApplyClick(this);" >

JS Code:

function Applyclick(args) {


if (errMsg != null) {
                       args.IsValid = false;

                      }

return false;
}

thanks in advance

modified 2-Feb-12 5:03am.

Re: Problem with args.isValid in JS

Mohibur Rashid1-Feb-12 22:36

Mohibur Rashid

1-Feb-12 22:36

I am sorry I dont know asp.net but yet
what is args and who is calling ApplyPromotionClick ???

I know I am coward since the day I know that fortune favors the brave

Re: Problem with args.isValid in JS

dayakar_dn1-Feb-12 23:03

dayakar_dn

1-Feb-12 23:03

Sorry function name should be applyclick

Re: Problem with args.isValid in JS

Mohibur Rashid1-Feb-12 23:10

Mohibur Rashid

1-Feb-12 23:10

In that case Check your Firefox or Chrome error message. I cant recall any html object property IsValid. I think you need to say more clearly what you need

I know I am coward since the day I know that fortune favors the brave

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.