/    Sign up×
Community /Pin to ProfileBookmark

Swap Images in Table & add ID…

Copy linkTweet thisAlerts:
Jan 26.2008

Hi Folks,

I am brand new to Javascript and I am trying to solve this issue:

[CODE]<SCRIPT LANGUAGE=JavaScript>
intImage = 2;
function swapImage() {
switch (intImage) {
case 1:
IMG1.src = “images/5_90.png”
intImage = 2
return(false);
case 2:
IMG1.src = “images/3_90.png”
intImage = 1
return(false);
}
}
</SCRIPT>[/CODE]

Using this Javascript and this

[CODE]<IMG id=”IMG1″ name=”IMG1″ src=”images/5_90.png”
onclick=”swapImage();”></p>[/CODE]

I am able to detect the state and switch between the 2 images (green/red)! As I am programming a theatre booking/reserving software for a friend of mine, I am looking for a way to achieve this:

Fetching a db and looking for an ID – if the Bool of the ID is yes, then display red – if its no, then display green. There are approx. 800 IDs (seats) in the theatre…The seats should be in a table – there I have faced the problem, that the code is not working when I have more than 1 image…

Thanks for any hints, your time and your help!

Best regards,

Stefan

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@KorJan 27.2008 — If a DB, why not writing directly the images with a server-side language (php, asp...) ?
Copy linkTweet thisAlerts:
@BosstoneauthorJan 27.2008 — Hi Kar,

thanks for your feedback! I thought PHP wouldn`t work because

of its lack of dynamically! The state of the seat should be changed (if possible - if the seat is not occupied) by the customer! I thought this is not possible with PHP - am I wrong?

thanks for your feedback,

Stefan
Copy linkTweet thisAlerts:
@BosstoneauthorJan 27.2008 — Hi,

first Goal is done:

[code=html]<script type="text/javascript" language="JavaScript">
function SwapImage(img,banner)
{
if(typeof(img.swap) == "undefined")
{
img.swap= true;
img.origSrc = img.src;
}
if(img.swap)
{
img.src = banner;
}
else
{
img.src = img.origSrc;
}
img.swap= !img.swap;
}
</script>[/code]

[code=html]<img src="images/5_90.png" IMG id="Row1_1" onClick="SwapImage(this,'images/3_90.png')">
<img src="images/5_90.png" IMG id="Row1_2" onclick="SwapImage(this,'images/3_90.png')">[/code]

This code is swaping more than 1 image...

Best regards,

Stefan
Copy linkTweet thisAlerts:
@BosstoneauthorJan 27.2008 — Hi Folks,

does anybody knows how I can get the variable "img id" into a

text field?

Thanks for your feedback,

Stefan
Copy linkTweet thisAlerts:
@BosstoneauthorJan 27.2008 — Hi Folks,

solved:

[code=html]<script type="text/javascript" language="JavaScript">
function SwapImage(img,id,banner)
{
document.form1.text.value=id;

if(typeof(img.swap) == "undefined")
{
img.swap= true;
img.origSrc = img.src;
}
if(img.swap)
{
img.src = banner;
}
else
{
img.src = img.origSrc;
}
img.swap= !img.swap;
}
</script>
</head>

<body>
<img src="images/5_90.png" id="Row1_1" onClick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_2" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_3" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_4" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_5" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_6" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_7" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_8" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_9" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_10" onclick="SwapImage(this, id, 'images/3_90.png')">
<img src="images/5_90.png" id="Row1_11" onclick="SwapImage(this, id, 'images/3_90.png')">

<form name="form1">
<textarea name="text" cols="60" rows="20" disabled></textarea>
</form>
[/code]
×

Success!

Help @Bosstone spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.27,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...