Solved

Changing the confirmation button caption in javascript

Posted on 2008-10-29
12
1,173 Views
Last Modified: 2010-05-18
Hi there;

I want to change the caption of confirmation button's caption from OK to Yes, from Cancel to No...

Is it possible? or any other function to do this job in Javascript?

Best regards...


<html>
<head>
<title>Cancelling events in onclick</title>
</head>
<body>
<a href="http://www.bilkent.edu.tr" onclick="return confirm('Load Bilkent home page?');">Bilkent</a>
</body>
</html>

Open in new window

0
Comment
Question by:jazzIIIlove
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 6
12 Comments
 
LVL 82

Assisted Solution

by:hielo
hielo earned 500 total points
ID: 22836114
>>I want to change the caption of confirmation button's caption from OK to Yes, from Cancel to No...
We all do!

>>Is it possible?
No, but there are alternatives... Let look for them
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 22836154
in fact, i can change the caption with VBScript but i just want to know if there is such a function or thing in Javasript...
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 22836159
thanks hielo...
0
SharePoint Admin?

Enable Your Employees To Focus On The Core With Intuitive Onscreen Guidance That is With You At The Moment of Need.

 
LVL 82

Accepted Solution

by:
hielo earned 500 total points
ID: 22836208
>>in fact, i can change the caption with VBScript
Yes, known fact, but that's IE only. Not with javascript:

Well I found what I was looking for, except it's not a confirm - its an alert:
http://slayeroffice.com/code/custom_alert/

But I have seen that in jQuery. I'll have to search more...
0
 
LVL 82

Assisted Solution

by:hielo
hielo earned 500 total points
ID: 22836309
http://trentrichardson.com/Impromptu/index.php

If you are confused about how to specify the custom labels, look at example 9.
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 22836383
for the slayer office...I am doing stg wrong but what..snippet attached...

for the other link: I am on it..

Best regards...
<html>
 
<head>
<title>Cancelling events in onclick</title>
<script>
var ALERT_TITLE = "Oops!";
var ALERT_BUTTON_TEXT = "Yes";
 
// over-ride the alert method only if this a newer browser.
// Older browser will see standard alerts
if(document.getElementById) {
    window.alert = function(txt) {
        createCustomAlert(txt);
    }
}
 
function createCustomAlert(txt1) {
    // shortcut reference to the document object
    d = document;
 
    // if the modalContainer object already exists in the DOM, bail out.
    if(d.getElementById("modalContainer")) return;
 
    // create the modalContainer div as a child of the BODY element
    mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
    mObj.id = "modalContainer";
     // make sure its as tall as it needs to be to overlay all the content on the page
    mObj.style.height = document.documentElement.scrollHeight + "px";
 
    // create the DIV that will be the alert 
    alertObj = mObj.appendChild(d.createElement("div"));
    alertObj.id = "alertBox";
    // MSIE doesnt treat position:fixed correctly, so this compensates for positioning the alert
    if(d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
    // center the alert box
    alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth)/2 + "px";
 
    // create an H1 element as the title bar
    h1 = alertObj.appendChild(d.createElement("h1"));
    h1.appendChild(d.createTextNode(ALERT_TITLE));
 
    // create a paragraph element to contain the txt argument
    msg = alertObj.appendChild(d.createElement("p"));
    msg.appendChild(d.createTextNode(txt1));    
 
    // create an anchor element to use as the confirmation button.
    btn = alertObj.appendChild(d.createElement("a"));
    btn.id = "closeBtn";
    btn.appendChild(d.createTextNode(ALERT_BUTTON_TEXT));
    btn.href = "#";
    // set up the onclick event to remove the alert when the anchor is clicked
    btn.onclick = function() { removeCustomAlert();return false; }
 
    
}
 
// removes the custom alert from the DOM
function removeCustomAlert() {
    document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
}
 
</script>
 
</head>
<body>
<!--<a href="http://www.bilkent.edu.tr" onclick="return confirm('Load Bilkent home page?');">Bilkent</a>-->
 
 
<a href="http://www.bilkent.edu.tr" onclick="createCustomAlert('Yes');">Bilkent</a>
 
</body>
</html>

Open in new window

0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 22836487
for the jQuery Impromptu:

I am very confused...I download it and it resides in the same hierarchy with my html file...But i think i editted the code wrong (i guess very wrong, don't laugh at me:)

Best regards...
<html>
<head>
<script language="javascript" src="jquery-impromptu.1.5.js">
 
var txt = 'Load Bilkent home page?<br />
      <input type="text" id="alertName" 
      name="myname" value="name here" />';
 
 
function mycallbackform(v,m){
      $.prompt(v +' ' + m.children('#alertName').val());
}
 
$.prompt(txt,{
      callback: mycallbackform,
      buttons: { Hey: 'Hello', Bye: 'Good Bye' }
});
 
</script>
</head>
<body>
<a href="http://www.bilkent.edu.tr" onclick="mycallbackform('Yes','No');">Bilkent</a>
 
</body>
</html>

Open in new window

0
 
LVL 82

Assisted Solution

by:hielo
hielo earned 500 total points
ID: 22836607
>>for the slayer office...I am doing stg wrong but what..snippet attached...
1. an alert() never returns false. So putting it on the onclick of a link will always cause it to navigate to the link
2. that customization of that alert box depends on the css that you find/see in the source code of that page. So you should really be looking at the source code.
0
 
LVL 12

Author Comment

by:jazzIIIlove
ID: 22836676
<<1. an alert() never returns false. So putting it on the onclick of a link will always cause it to navigate <<to the link

you are absolutely right...

for second, ok, i will be looking...

Best regards...Thanks for your effort...

0
 
LVL 12

Author Closing Comment

by:jazzIIIlove
ID: 31511450
well...hielo is the MVP in this site...
0
 
LVL 82

Expert Comment

by:hielo
ID: 22836761
>>for the jQuery Impromptu:...
Well, you have
>><script language="javascript" src="jquery-impromptu.1.5.js">

but that plugin does NOT include the jQuery library. You still need to link to the jQuery library. You also needs the accompanying css.

Lastly, when you import a javacript file, you cannot have code in between the script tags:
CORRECT: <script src="somefile.js"></script>
INCORRECT: <script src="somefile.js"> var x=3; ....</script>

Open in new window

0
 
LVL 82

Expert Comment

by:hielo
ID: 22836764
you are welcome
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

623 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question