Pop-up time select for form field

I have a form:

<input type="text" name="RequestedTC" size="15">

I need a link next to this form field that the user can click on causing a small pop-up window to appear allowing the user to select a time between 6 AM and 6 PM. As soon as they click a time it closes the pop-up and puts the selected time into the form field in this format: h:mm pm/am ('8:30 am' for example).

First person to program this for me gets the points.

Thanks,
Max
Max_DavisAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

fritz_the_blankCommented:
Here you go:

*************
main.htm
***************
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--
function newWindow(strWin,strURL,intX,intY,intWidth,intHeight){
      strWin =window.open(strURL,strWin,'left=' + intX + ', screenX =' + intX + ', top=' + intY + ', screenY=' + intY + ', width=' + intWidth + ', height=' + intHeight + ', scrollbars=yes, toolbar=yes');
      strWin.focus();
}

//-->
</SCRIPT>
</HEAD>
<BODY>

<FORM action="" method=POST id=form1 name=form1>
<input type="text" name="RequestedTC" size="15"><a href= # onClick="newWindow('timePop','timePop.htm',0,0,200,200); return false;">Select time</a>

</FORM>
</BODY>
</HTML>


**********
timePop.htm
***********

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--
function setForm(){
      var strValue=document.forms[0].select1.options[document.forms[0].select1.selectedIndex].text;
      window.opener.document.forms[0].RequestedTC.value=strValue;
      window.close();

}
//-->
</SCRIPT>

</HEAD>
<BODY>
<FORM action="" method=POST id=form1 name=form1>
<SELECT id=select1 name=select1>
      <OPTION>1:00 AM</OPTION>
      <OPTION>2:00 AM</OPTION>
      <OPTION>3:00 AM</OPTION>
      <OPTION>4:00 AM</OPTION>
      <OPTION>5:00 AM</OPTION>
      <OPTION>6:00 AM</OPTION>
</SELECT>
<INPUT type="button" value="Select Time" id=button1 name=button1 onClick=setForm()>
</FORM>
</BODY>
</HTML>
0
XxavierCommented:
this as well, a little simpler

<html>

<head><script>
function popup(){
win=window.open("","","")
str='<form ><p><select  name="s" size="1" onchange="self.opener.document.f1.t1.value=s.value">'
str+='<option value="10:30">10:30</option><option value="11:00">11:00</option>'
str+='<option value="11:30">11:30</option></select></p></form>'
win.document.write(str)}
</script>

<title></title>
</head>

<body>

<form name="f1">
  <p><input type="text" name="t1" size="20"></p>
</form>

<p onclick="popup()">link</p>
</body>
</html>
0
Max_DavisAuthor Commented:
Sorry, I guess my description didn't explain that I wanted the time selection popup to list the times as links.

For example in the popup it would look like this:

6 | 7 | 8 | 9 | 10 | 11 | 12 | 1 | 2 | 3 | 4 | 5 | 6

when you click on the 7 it would pass "7:00 am" to the form field.
0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

devicCommented:
<html>
<body>

<script>
function runit()
{
      var popup=window.open("","","width=200,height=100");
      var s="<html><body><form>"
      s+="<select name=hours>";
      for(var i=1;i<7;i++)
      {
            s+="<option value=0"+i+">0"+i
      }
      s+="</select>";
      s+="<select name=minutes>";
      for(var j=0;j<60;j++)
      {
            s+="<option value="+(j<10?'0'+j:j)+">"+(j<10?'0'+j:j)
      }
      s+="</select>";
      s+="<select name=ampm>";
      s+="<option value=am>am";
      s+="<option value=pm>pm";
      s+="</select>";
      s+="<input type=button onclick=\"opener.document.f1.RequestedTC.value=this.form.hours.value+':'+this.form.minutes.value+' ' + this.form.ampm.value;self.close()\" value=\"ready\">";
      s+="</form></body></html>"
      popup.document.write(s)
}
</script>

<form name=f1>
<input type="text" name="RequestedTC" size="15"><input type=button onclick=runit() value="set time">
</form>

</body>
</html>
0
devicCommented:
<html>
<body>

<script>
function runit()
{
      var popup=window.open("","","width=200,height=100");
      var s="<html><body><form>"
      s+="<select name=hours>";
      for(var i=6;i<13;i++)
      {
            s+="<option value="+(i<10?'0'+i:i)+">"+(i<10?'0'+i:i)
      }
      s+="</select>";
      s+="<select name=minutes>";
      for(var j=0;j<60;j++)
      {
            s+="<option value="+(j<10?'0'+j:j)+">"+(j<10?'0'+j:j)
      }
      s+="</select>";
      s+="<select name=ampm>";
      s+="<option value=am>am";
      s+="<option value=pm>pm";
      s+="</select>";
      s+="<input type=button onclick=\"opener.document.f1.RequestedTC.value=this.form.hours.value+':'+this.form.minutes.value+' ' + this.form.ampm.value;self.close()\" value=\"ready\">";
      s+="</form></body></html>"
      popup.document.write(s)
}
</script>

<form name=f1>
<input type="text" name="RequestedTC" size="15"><input type=button onclick=runit() value="set time">
</form>

</body>
</html>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
devicCommented:
as links???
and with all minutes?

6 | 6.01 | 6.02......
0
Max_DavisAuthor Commented:
Not with all minutes, just the hours.
0
Max_DavisAuthor Commented:
Actually, on second though.. i'm sorry. I guess I will just use your code devic, I messed with it a little bit and made it work for me.

Thank you for the help.

- Max
0
fritz_the_blankCommented:
Here is the updated timePop with links:

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--
function setForm(strValue){
      window.opener.document.forms[0].RequestedTC.value=strValue;
      window.close();

}
//-->
</SCRIPT>

</HEAD>
<BODY>

<a href=# onClick="setForm('1:00AM');return false;">1:00 AM</a>
<a href=# onClick="setForm('2:00AM');return false;">2:00 AM</a>

</FORM>
</BODY>
</HTML>


FtB
0
fritz_the_blankCommented:
What was wrong with my first post? And this last one?

FtB
0
Max_DavisAuthor Commented:
Oh, is it possible to have the minutes drop down only show the following options: 00, 15, 30 and 45?
0
Max_DavisAuthor Commented:
fritz: Your code looked good but it didn't even need to be a pop-up if all it was.. was a select box with times, could have had that on the form main page. Probably my error for not being descriptive enough, i'm sorry.
0
fritz_the_blankCommented:
I am just a little miffed because your question said:

>>I need a link next to this form field that the user can click on causing a small pop-up window to appear allowing the user to select a time between 6 AM and 6 PM. As soon as they click a time it closes the pop-up and puts the selected time into the form field in this format: h:mm pm/am ('8:30 am' for example).<<

So I created a popup that passed the value back to the form just like you asked. I didn't feel that it was my place to tell you how to design your page.....


FtB
0
Max_DavisAuthor Commented:
fritz: I am sorry, thats the nature of the EE beast.. I award the points for the code I end up using, the code that best fits my needs.

How do you give "Assist" points?
0
devicCommented:
<html>
<body>

<script>
function runit()
{
      var popup=window.open("","","width=400,height=100");
      var s="<html><body>"
      var j=6;
      var b=false;
      for(var i=1;i<14;i++)
      {
            
            s+="<a href='ja"+"va"+"scr"+"ipt:opener.document.f1.RequestedTC.value=opener.f("+i+");self.close();'>"+j+"</a> | ";
            if(j>11){b=true}
            if(b){j--}else{j++;}
      }
      s+="</body></html>"
      popup.document.write(s)
}
function f(num)
{
      if(num==1) return "06:00 am"
      if(num==2) return "07:00 am"
      if(num==3) return "08:00 am"
      if(num==4) return "09:00 am"
      if(num==5) return "10:00 am"
      if(num==6) return "11:00 am"
      if(num==7) return "12:00 am"
      if(num==8) return "11:00 am"
      if(num==9) return "10:00 am"
      if(num==10) return "9:00 am"
      if(num==11) return "8:00 am"
      if(num==12) return "7:00 am"
      if(num==13) return "6:00 am"
}
</script>

<form name=f1>
<input type="text" name="RequestedTC" size="15"><input type=button onclick=runit() value="set time">
</form>

</body>
</html>
0
devicCommented:
oops am-pm
i don’t know good what are am pm :)


    if(num==1) return "06:00 am"
    if(num==2) return "07:00 am"
    if(num==3) return "08:00 am"
    if(num==4) return "09:00 am"
    if(num==5) return "10:00 am"
    if(num==6) return "11:00 am"
    if(num==7) return "12:00 am"
    if(num==8) return "11:00 pm"
    if(num==9) return "10:00 pm"
    if(num==10) return "09:00 pm"
    if(num==11) return "08:00 pm"
    if(num==12) return "07:00 pm"
    if(num==13) return "06:00 pm"
0
fritz_the_blankCommented:
That is generally done by posting a separate question with a title like "Points for Fritz the Blank"

Of course I don't want you to be awarding points when the code is not what you asked for; I guess that I am suggesting that a little more time goes into formulating the question so that a good response will be code that you can use.

FtB
0
Max_DavisAuthor Commented:
Wow, thanks devic. That is exactly what I was talking about. Now a have both versions. I love options. :)

For your first one, can you recode it so it only gives 00, 15, 30, 45 for minute options?
0
devicCommented:
easy ;)
===================
<html>
<body>

<script>
function runit()
{
    var popup=window.open("","","width=200,height=100");
    var s="<html><body><form>"
    s+="<select name=hours>";
    for(var i=6;i<13;i++)
    {
         s+="<option value="+(i<10?'0'+i:i)+">"+(i<10?'0'+i:i)
    }
    s+="</select>";
    s+="<select name=minutes>";
         s+="<option value=00>00";
      s+="<option value=15>15";
      s+="<option value=30>30";
      s+="<option value=45>45";
    s+="</select>";
    s+="<select name=ampm>";
    s+="<option value=am>am";
    s+="<option value=pm>pm";
    s+="</select>";
    s+="<input type=button onclick=\"opener.document.f1.RequestedTC.value=this.form.hours.value+':'+this.form.minutes.value+' ' + this.form.ampm.value;self.close()\" value=\"ready\">";
    s+="</form></body></html>"
    popup.document.write(s)
}
</script>

<form name=f1>
<input type="text" name="RequestedTC" size="15"><input type=button onclick=runit() value="set time">
</form>

</body>
</html>
0
Max_DavisAuthor Commented:
Yeah, easy.. but i'm lazy. :)
Thanks again.
0
fritz_the_blankCommented:
@devic--

I am glad you got the points for all of your hard work in this thread, however, is it just me or did I not answer the question as asked, very quickly after it was requested? I feel like I am getting the short end of the stick here because the question did not reflect what was wanted....

FtB
0
devicCommented:
@fritz_the_blank

you are right you was first with working example, my RESPECT to you!

i understood that format h:mm am/pm needs minutes from 00 to 59.

i think Max_Davis is not quite right:
  1. did not describe what exactly needs.
  2. points for first answer is not good idea, because first answer could be with mistakes or incomplete.


reagrds,
devic

P.S.
i don't receive mails with notification for new comments.
somebody else has the same problem?


0
fritz_the_blankCommented:
It is a little funky today as far as the email notifications are going.

Max_Davis may not realize that we are not paid employees of EE, but rather, modern-day good samaritans taking time out of our busy day to help those in need. One way to respect that giving spirit might be to take a little more time in formulating questions so that s/he doesn't waste anyone's time.

See you around, devic.

FtB
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.