Toggle Image Buttons using Javascript - How?

Hi,
Hoping someone can assist me with javascript and how to toggle buttons.
My scenario is as follows - I have two buttons side by side, say Button_A and Button_B but I also have two other buttons, i.e Button_C and Button_D which are not displayed at start-up, only Button_A and Button_B are displayed.
With javascript, I need a means of switching buttons over the top of Button_A and Button_B, i.e if I press Button_B, Button_A gets replaced with Button_C and Button_B gets replaced with Button_D.
At the moment, each button is inside unique div id, and each button is displayed as an image within an img tag.
Also need a means of accessing buttons via javascript, even if I haven't actually clicked that particular button, i.e if I click Button_B which fires an onclick event, I need to perform operations on Button_A as well. Unsure how to access Button_A object?
Any assistance on the above would be much appreciated.
Thanks,
Tony.

Hi,
It sort of helps but lets say in your example you had another image column called IMAGE2, which had a image of a green circle, so that when you clicked on the green tick within your IMAGE column, this changed to a red cross as it does now but at the same time, also toggled the green circle to a blue square, even though you didn't click on this green circle image, just on the green tick.
How might this be done in Javascript?
Hope this makes sense.
Thanks.
Tony.

Similar Messages

Associating two events with submit button using javascript in jsp

Hi
How can i Associate two events with submit button using javascript in jsp. Firstly it should insert the data to database and secondly it should close the same pop-up window

Have something like :
<input type="submit" name="submitbtn" value="Click me" onClick="function1(); function2(); " />
You just call both functions sequentially, it's that simple. Although using javascript to work with a database, that seems a bit tricky.

Disable button using javascript

Hi,
I'm sorry if this is a relatively simple problem, but I have tried several things and have searched the forum, but still no luck!
I am trying to get a button in a form to be disabled or hidden on loading the page and only to become enabled or shown once an 'onclick' event occurs. I already have a javascript function running successfully on the 'onclick' event, so there is no problem with that.
Preferably I would like the button to be template driven, but I realise that disabling/hiding it may only be possible with an HTML button.
I have tried the following JavaScript, but it appears to do nothing:
document.getElementById('P6_OK').disabled=true;
$x_HideItemRow('P6_OK');
If the JavaScript is ok it is probably the way I am implementing it into the HTML.
Thanks
Lucy

Hi,
I'm still having troubles with this (see above). If anyone has successfully managed to disable a button using JavaScript I would be interested in how they did it.
To clarify, I have tried the following two pieces of script, among others:
(1) document.getElementById('P6_OK').disabled=true;
(2) $x_HideItemRow('P6_OK');
I have read quite a few forum links and followed what others have done, but in vain.
Thanks for your help
Lucy

Hide an HTML button using javascript

Hi,
I need to hide an html buttton using javascript. I have an radio button with values "YES" and "NO". If is select NO then i need hide the button without refreshing the page. Can anyone suggest me how to hide an button using javascript.
Thanks
Prashanth

Prashanth,
The exact solution will vary based on a few factors. The basic idea is to place an event handler on the radio button item that calls a function to hide/show the button. You might also want to call that function when the page loads too.
If you put an example page on apex.oracle.com and provide the workspace/username/password I'll take a look. You can create a new account for this purpose.
Regards,
Dan
Blog: http://DanielMcGhan.us/
Work: http://SkillBuilders.com/

How to Disable a Button Using JavaScript

Hi,
I want to disable a button based on a condition. I am using a template based button (button Alternate 3). I am using Theme 3. I have created buttons of type item but when I view the source there is no button name populated in the html. My javascript is not disabling the button.
Please advice.
Thanks
sukarna

Hi,
You can't disable an A tag (FireFox, for example, will still let you click the "link").
What you could do would be to create a second button that doesn't work and only show one of these at a time.
I have done that here: [http://apex.oracle.com/pls/otn/f?p=35917:30]
The Button has been based on a custom Button Template. The definition for this is:
<table class="t10Button" cellspacing="0" cellpadding="0" border="0" summary="" id="#BUTTON_ATTRIBUTES#">
<tr>
<td class="t10L"><a href="#LINK#"><img src="#IMAGE_PREFIX#themes/theme_10/button_left.gif" alt="" width="4" height="24" /></a></td>
<td class="t10C"><a href="#LINK#">#LABEL#</a></td>
<td class="t10R"><a href="#LINK#"><img src="#IMAGE_PREFIX#themes/theme_10/button_right.gif" width="4" height="24" alt="" /></a></td>
</tr>
</table>
<table class="t10Button" cellspacing="0" cellpadding="0" border="0" summary="" id="#BUTTON_ATTRIBUTES#_DISABLED" style="display:none">
<tr>
<td class="t10L"><img src="#IMAGE_PREFIX#themes/theme_10/button_left.gif" alt="" width="4" height="24" /></td>
<td class="t10C" style="padding:1px 4px;">#LABEL#</td>
<td class="t10R"><img src="#IMAGE_PREFIX#themes/theme_10/button_right.gif" width="4" height="24" alt="" /></td>
</tr>
</table>This actually creates two buttons - the first one, which actually has the link, is visible to start with. The second one, which has no link at all, starts off as invisible.
Both buttons use the #BUTTON_ATTRIBUTES# setting to get the button name into the ID - though the second button adds "_DISABLED" to this so that it has a unique, but known, ID
Then it is just a case of calling a function to show one button and hide the other or vice versa:
<script type="text/javascript">
function disableButton()
document.getElementById('P30_TEST_BUTTON').style.display = "none";
document.getElementById('P30_TEST_BUTTON_DISABLED').style.display = "block";
function enableButton()
document.getElementById('P30_TEST_BUTTON').style.display = "block";
document.getElementById('P30_TEST_BUTTON_DISABLED').style.display = "none";
</script>Another possibility is to add the #BUTTON_ATTRIBUTES# to the TABLE tag instead of the A tag in a new button template (based on a copy of the normal Button template). Then, the ID value would be applied to entire "button". You can then make this invisible using:
$x('BUTTON_ID').style.visibility = 'hidden';The button will be removed from the page as far as the user is concerned, so they can not click the link.
Andy

Selecting or highlighting node or mesh by button using javascript

Hi
I have 3D pdf model with node 1001 or mesh name 2002 and when I klick it by mouse on 3D view it is highlighted and get orange boundary box.
I have created button name 1001 button and I would like to add to this button javascript function which will highlight this node or mesh in the same way as click on those.
I found in discusion some way of make it for example red by changing rendering mode to illustration but it is not what I am trying to do. I asking if it is possible just select from button using name of node or mesh. if you have any exmaple of script i will be very pleased.

thanks for answer.
It is not what I want to do
I have 5 layer and on each layer I have one node and under neath one mesh.
I would like to select node or mesh by clicking button created on page not by clicking in 3d model or Model Tree. Like below bottles are selected (highlighted).
NowI doing it like that:
BUTTON 1-----------------------------------------------
myAnnotObj = getAnnots3D(0)[0].context3D;
myAnnotObj.scene.defaultRenderOptions.illustrationRenderModeFaceColor.set( 1, 0, 0 );
for (var i = 0; i < myAnnotObj.scene.meshes.count; ++i)
mesh = myAnnotObj.scene.meshes.getByIndex(i);
mesh.renderMode = "solid";
HighlObj = myAnnotObj.scene.meshes.getByName("1001");
HighlObj.renderMode = "illustration";
BUTTON 2-----------------------------------------------
myAnnotObj = getAnnots3D(0)[0].context3D;
myAnnotObj.scene.defaultRenderOptions.illustrationRenderModeFaceColor.set( 1, 0, 0 );
for (var i = 0; i < myAnnotObj.scene.meshes.count; ++i)
mesh = myAnnotObj.scene.meshes.getByIndex(i);
mesh.renderMode = "solid";
HighlObj = myAnnotObj.scene.meshes.getByName("2002");
HighlObj.renderMode = "illustration";
in this method I have to clean old selection in the loop doing this render mode back to solid. In the same time my selection not working at all in render mode illustration. So I would like to find how to select like in picture from button in document. by script.

Adobe Reader Submit Button using JavaScript

We have a form that when submitted it needs to use javascript to update the Subject Line of the email message for our workflow process. This process works absolutely great when using Acrobat. However, when sent to someone using Reader (even with JavaScript enabled through preferences) nothing happens when the button is clicked. The form was designed in Acrobat 10 Professional.
Here is the JavaScript we are using...
var wsuid = this.getField ("mywsuid");
var d = new Date();
var month = d.getMonth()+1;
var day = d.getDate();
var year = d.getFullYear();
var today = ((''+month).length<2 ? '0' : '') + month + '/' + ((''+day).length<2 ? '0' : '') + '/' + day + year;
var name = this.getField("name");
var subject = "subject: " + (wsuid.valueAsString) + ":" + (name.valueAsString) + ":" + (today);
this.mailDoc({
    bUI: true,
    cTo: "[email protected]",
    cCc: "",
    cSubject: subject,
Suggestions on getting this to work with Acrobat Reader is much appreciated.
Dawn Bleuel
Wichita State University

I was able to open the JavaScript debugger in Acrobat Pro. When the document is Reader Enabled, I get the following message:
Acrobat EScript Built-in Functions Version 10.0
Acrobat SOAP 10.0
NotAllowedError: Security settings prevent access to this property or method.
Doc.subject:15:Field Submit:Mouse Up
And in Acrobat Pro - I now see Protected View is set to Off.

How to select a radio button using javascript?

Hi,
I have 2 radio buttons as shown below:
<input id="poBoxRadio" name="poBoxRadio" type="radio" class="radio-btn" value="No" /> No
<input id="poBoxRadio" name="poBoxRadio" type="radio" class="radio-btn" value="Yes" /> YesI want to select one of this radio button, according to the following condition in javascript:
<script type="text/javascript">
if (<%=option1%> != ""){
// Radiobutton "No" should be selected.
else if (<%=option2%> != ""){
// Radiobutton "Yes" should be selected.
</script>How can I do this in Javascript? Any help will be highly appreciated.
Thanks,
Rishi

I have solved this issue using the following:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var a='', b='d';
</script>
</head>
<body>
<input id="poBoxRadioNo" name="poBoxRadio" type="radio" class="radio-btn" value="No" /> No
<input id="poBoxRadioYes" name="poBoxRadio" type="radio" class="radio-btn" value="Yes" /> Yes
<script type="text/javascript" defer="defer">

</script>
<input disabled type="button" value="UP" onclick="setVariable('move=1')">
</body>
</html>Thanks to all of you!

Referencing a button using javascript

Hi there
Does anyone know how to reference a button (button in region position) in javascript? I have tried using document.getElementById(<button name>).disabled=true and document.getElementByName(<button name>).disabled=true and keep getting errors. I am needing this to enable and disable a button depending on a value selected from a select list.
Cheers
Heidi

Hi,
Try this:
Use this in your JavaScript code.
$('button[type="button"][value="Cancel"]').attr('disabled', 'disabled');It is a jQuery code which I tried on a template based button with Text Label/Alt as "Cancel"
which is used in above code *[value="Cancel"]*.
The normal disabling mechanism with above methods don't work on Template Based Button
as it is not constructed using <input></input> internally in ApEx but using <button></button>
and hence they do not have any attribute id.
Hope this helps!
Regards,
Kiran

Custom print button using javascript for landscape document

I am working on a document that has 50+ pages and am wanting to have a print button on most of them to print the exact page. The document is landscape and I need the "Auto-Rotate and Center" toggle to be checked on, but I don't know how to code that. This is what I have so far:
this.print({
bUI: true,
bSilent: false,
bShrinkToFit: false,
nStart: 2,
nEnd: 2
Does anyone know how to get the "Auto-Rotate and Center" checked on and where to add it to the code?
Thanks so much for any help.

Hi Jaydeep,
I had already debugged and removed
'Include(Users)'.
if i remove 'Include(Users)'. i'm not getting user enumerator. It will be empty.
Since there are no users loaded in the object, the entire function not working.
Thanks,
Bharath P N
P N Bharath

Watermarking over a non-static 3D image? (using javascript?)

Hi,
I am trying to resolve the issue I have of not being able to create a watermark to sit permanetly over the top of a non-static 3D image.
I am aware that I cannot use the normal watermarking method so I have been looking at Javascript methods...
Im not familair with Javascrpit at all but so far I have a simple script inserted in my console window but am not sure what to do next to get this to activate and work.
p.s the watermark to be used is a simple jpg. file.
The javascipt currently in the console window is.......
this.addWatermarkFromFile()
cText:"C:\Documents and Settings\Acomlay\My Documents\EEC watermarking and logo\COPYRIGHT"
nOpacity: 0.5
Any help appreciated
Ali.

Hi,
What I mean is... its a 3D CAD model which I have converted in acrobat 9 Pro from Pro Engineer (straight foward 3d pdf). The problem is when I add a watermark using the built in tools....the watermark is displayed correctly but the 3D veiwing of the model is lost and it effectively becomes a flat 2d image.
My predecessor in this job has told me that originally he had some form of script in place so he could batch the watermarking action to various files, which Is what I need to be able to do.
Also he said that it was important to set the background to transparent in the 'properties' menu. That is all he can remember.

My javascript is not working. When I click on a certain image/s (used javascript) the window where must be opened that image is blank. Can you help me please, I tried everything...?

I tried to disable and enable it again but without success. I re-installed mozilla 2-3 times and again nothing.

Restart...
Press and hold the Sleep/Wake button until the red slider appears. Slide your finger across the slider to turn off iPad. To turn iPad back on, press and hold the Sleep/Wake until the Apple logo appears.
Keep this handy: http://manuals.info.apple.com/en_US/iPod_touch_iOS4_User_Guide.pdf

How to set a page parameter using javascript ?

Hi:
i'd like to set page parameter with a value taken from a textbox when clicking a button using javascript code.
i mean, i have a textbox and a button using javascript and i want to take the value from the textbox and when onClick event happens set that value to the page parameter. How can i do this????
Thanks.
Best regards. Urko.

Hi,
Can you please elaborate your requirement. May be some better ways can be suggested. Also please mention which component you are using.
Thanks,
Sharmila

How can I see how often and where an image is used in the site?

Just realized the post appeared twice as at first sending I
got an error page (contains no data...).
So, please do all answer to the other post, so that all
replies get collected at one post only.
Hello,
please excuse my maybe dumb question but converting from
GoLive I am still trying to find several practical effective
workflow features in DW ...
1. where in the sitewindow/assets or files panel can I see an
indication at each image if and how often it is used in a site?
2. and where can I see/check on which pages it is used?
Thanks in advance for guiding me there ...
bye,
Beate

> How do DW users know how often and where an image is
used on the site
> then?
I'm not sure what the benefit is of knowing how often an
image is used, but
a search for the image by filename would do the trick.
And just so you'll know, this is a peer forum, not an
official communication
vehicle to Adobe. We are all just users here, not Adobe
employees.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"beatrice" <[email protected]> wrote in
message
news:[email protected]...
> OK. I sent the below feature request.
> How do DW users know how often and where an image is
used on the site
> then?
> always doing a find/search?
> in GoLive there was an simple window where all the files
a page consisted
> of
> were listed plus all the files that were pointing to
that page. such,
> without
> having to open a page links and image and componentes
etc. could be
> changed via
> point&shoot.
>
> Couldn't you all think of this a being great and helpful
and making site
> management easy? Then send in a feature request as well,
please.
>
> ...............
> How can one know by the assets or files list if an image
is used at all on
> the
> site?
> and how many times? and on which pages?
> This is very useful to know especially in larger sites.
> e.g. an image should get changed on one page, now it
would be very good to
> see
> if when it was used on other pages as well if it would
make still sense
> there
> when changed.
> as DW can update files (when e.g. an image name gets
changed) there is a
> way
> this is already recorded. why not take this records and
send this back
> into a
> list/column in the files panel to indicated that the
image is used and
> how
> many times.
> plus to have another window that can display all the
pages the image is
> used
> in.
> so one could click through all those pages and open them
to check the
> image
> there.
> in GoLive that feature was called 'In and Out links' and
one could see a
> page
> in the middle and left and right from it many
branches/lines at which ends
> the
> filenames were visible used in that page.
> so one e.g. could also point and shoot from this list
and change a file or
> image or component simply by point and shooting to the
files panel without
> having to open the pages.
> These features were so practical for an effective daily
workflow that I
> don't
> understand why they haven't been put into cool DW yet.
Please, please do
> so in
> the next release. I can test it thoroughly if you need
testers for it.
> bye,
> beate
>

Setting source property of Trinidad image component using java script

Hi,
Can anyone tell me how to set the source property of Trinidad Image component using javascript.
i tried document.getElementById("f1:img").source="/images/neha.gif".
But its not working
Thanks
Neha

Hi,
Bases on the solution you suggested, i tried the img component to change the image on OnMouseOver and OnMouseOut. Its working fine in a normal browser but doesnt work in Mobile browser. May be because mobile browser supports only trinidad components. I then tried the option of backing bean
" Or you can expose the component to a backing bean by setting its "binding" attribute. JDeveloper can create a backing bean from the wizard if you don't already have one. This will get you a CoreImage object in the bean, and you can change the source with its setSource method."
. So i bound the omMouseOver event of the trinidad image component to a backing bean. Inside that i am changing the source and refreshing the component.
<tr:commandLink id="cl1" action="goAlerts" styleClass="listingLink2">
<tr:image source="/images/alert.gif" id="i4"
binding="#{Images.alertOnMouseOver}"
onmouseover="#{Images.alertOnMouseOver}"/>
</tr:commandLink>
Images.java
public void setAlertOnMouseOver(CoreImage alertOnMouseOver) {
this.alertOnMouseOver = alertOnMouseOver;
alertOnMouseOver.setSource("/images/alertSelect.gif");
RequestContext context = RequestContext.getCurrentInstance();
context.addPartialTarget(alertOnMouseOver);
System.out.print("Test");
So what i found is setAlertOnMouseOver is getting called but not MouseOver event but when the page is loaded. Can you please tell me where i am going wrong?

Toggle Image Buttons using Javascript - How?

Similar Messages

Maybe you are looking for