About

I'm Mike Pope. I live in the Seattle area. I've been a technical writer and editor for over 30 years. I'm interested in software, language, music, movies, books, motorcycles, travel, and ... well, lots of stuff.

Read more ...

Blog Search


(Supports AND)

Google Ads

Feed

Subscribe to the RSS feed for this blog.

See this post for info on full versus truncated feeds.

Quote

People think that you have these things called ideas and that writing is a matter of imposing them on the subject material, whereas it's only in the writing that I discover what it is that I think.

Anthony Lane



Navigation





<August 2014>
SMTWTFS
272829303112
3456789
10111213141516
17181920212223
24252627282930
31123456

Categories

  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  
  RSS  

Contact

Email me

Blog Statistics

Dates
First entry - 6/27/2003
Most recent entry - 7/23/2014

Totals
Posts - 2304
Comments - 2493
Hits - 1,656,405

Averages
Entries/day - 0.57
Comments/entry - 1.08
Hits/day - 407

Updated every 30 minutes. Last: 6:27 AM Pacific


  08:16 PM

THe topic of creating a pop-up calendar seems to be a perennial favorite.[1] I played around with one some time ago, which in that case mostly consisted of channeling someone else's ideas.

And so again. My friend Michael B was working on his own version, which involved what I thought was a significant improvement: rather than popping up the calendar in a pop-up (that is, using window.open), he was using CSS attributes to show and hide a calendar. The problem with using window.open is that it can be blocked by pop-up blockers. But simply showing and hiding a calendar should be no problem, assuming JavaScript is enabled.

The basic concept is this. A normal ASP.NET calendar lurks on the page, but its style visibility attribute is initially set to hidden. A client-side show-the-calendar button runs JavaScript to set the style visibility attribute to visible. Gentle User selects a date (the postback, she occurs), and then server-side code returns the date to whatever (ASP.NET) text box you want. (Naturally, the calendar has to be absolutely positioned, and should probably have a z-order that guarantees that it will appear in front of everything else.)

Here's what it looks like -- you can play with it on this page.



Naturally, there were complications. Some were self-imposed, of which the biggest was that I wanted to re-use a single Calendar control. This meant (as I eventually figured out) that I had to store information about the textbox that the Calendar was "bound" to and about the top/left location where the Calendar should appear -- I wanted it to have an offset from the button that had invoked it, rather than a fixed position on the page.

The button that invokes the calendar is all client-side, so I was obliged to use a somewhat clunky mechanism of a) writing a client-side function that would take the ID of the "bound" text box, b) capture the top/left coordinates of the invoking button, and apply them to the calendar, and c) store all that in a hidden field. This last enables me to pass the info up to the server on postback. Because I was doing all this in a hurry, I elected to store the three pieces of information in a string delimited by "+".[2]

When the user selects a date in the calendar, server-side code plucks the ID of the "bound" text box out of the hidden field, finds the actual text box instance, and sets its Text property to the date. Server code then hides the calendar, since we're now done with it.

A tricky thing arose in month navigation -- the calendar does a postback, but we don't want it to disappear until the user actually selects a date. In that case, server code plucks the top and left values out of the hidden field and (re)applies those to the calendar so it will (continue to) show up at the right spot.

You can see the source code for the whole page here. For a change of pace, I wrote the server code in C#; I need the practice.

There's a lot of code required for this -- client code, server code, and fussy function calls for the buttons doing the invoking. This really wants encapsulation in a control. I played briefly with making the whole business a user control, but realized I needed to do actual work to determine the ID of the Calendar control inside a container user control. So I put that off till I could "think about it more."

But anyway, I have a sense of what needs to be done, I guess. I'll work it all into a single control Real Soon Now.

[1] To some extent, this kind of discussion will be moot in the near future, when we can use any of dozens of soon-to-be AJAX-y calendars that require no server involvement at all.

[2] Incidentally, I ran into some DHTML and JavaScript issues here. The top and left style properties return the value plus the units -- e.g. 100px. In IE, you can get the posTop and posLeft properties, which are just numbers, no units. But those aren't supported in Firefox. So I had to get top, which is a string, and strip px. Then I want to add 15 pixels to it -- (top + 15). But it's a string! So the + operator concatenates (stupid overloaded operators, haha) and comes up with, say, 10015. You need to coerce the damm thing back into a number, which I did with this hackery: (1 * top) + 15. I assume there's a better way to do this, probably involving a method named Parse, yes?

[categories]  

[16] |