Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

How do I make an input field open a javascript alert box?

Posted on 2011-09-22
5
Medium Priority
?
290 Views
Last Modified: 2012-06-22
I have a form that has a date field and an icon for a popup calendar.

When the user clicks inside the date field I want an alert box to appear telling them they must use the icon for the popup calendar.

Is there a way to do this by the date field id? I may not be able to add code to the actual date field input.
0
Comment
Question by:Donnie Walker
[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
5 Comments
 
LVL 59

Accepted Solution

by:
HainKurt earned 2000 total points
ID: 36582383
try this
<input id=dateField>
<script>
function msg(){alert ("use button!");}

var inp = document.getElementById("dateField");
if( inp.attachEvent ){
   inp.attachEvent("onclick",function(){msg();});
} else {
   inp.setAttribute("onclick", "msg();"); 
}
</script>

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 36582432
what about :

<script type="text/javascript" language="javascript">
window.onload = function() {  document.getElementById("dateFieldID").setAttribute("readonly", "true"); }
</script>

or


<script type="text/javascript" language="javascript">
window.onload = function() {  document.getElementsByName("dateFieldName")[0].setAttribute("readonly", "true"); }
</script>
0
 
LVL 4

Expert Comment

by:jmnf
ID: 36582470
Not an actual answer, just my 2 cents.

I use jQuery Datepicker for selecting dates, and show it on icon and on textbox click like so

$( "#datepicker" ).datepicker({
    showOn: "both",
    buttonImage: "images/calendar.gif",
});

Open in new window


make input text "readonly" like this

<input type="text" name="someName" value="someValue" readonly="readonly" />

Open in new window


or if by any chance you are using vb.net or c# you can add it to a textbox in your page load like

textbox1.attributes.add("readonly","readonly")

Open in new window

0
 
LVL 59

Expert Comment

by:HainKurt
ID: 36582476
or what about this (when it is clicked button will be called :)
<input id=dateField> <img id=imgCalendar onClick="calendar('datefield')" src="calendar.gif" width=20 height=20>
<script>
function calendar(elm){alert ("Calendar popup!");}
function msg(){alert ("use button!");}

var inp = document.getElementById("dateField");
if( inp.attachEvent ){
   inp.attachEvent("onclick",function(){imgCalendar.click();});
} else {
   inp.setAttribute("onclick", "imgCalendar.click();"); 
};
</script>

Open in new window

0
 

Author Closing Comment

by:Donnie Walker
ID: 36582655
thanks!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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…

715 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