Last week, I got TT2, CGI::Application, Class::DBI, and Number::Tolerant all engaging in wonderful harmony. It turned out, by the way, that I didn't need any kind of magic trigger to catch strings and convert them before they hit the database. It's more like this: my class has some fields that are inflated into tolerance objects. I can assign tolerances to them, and their stringification is stored to the database. When Class::DBI finds that stringification, it knows how to turn it back into an object. The beauty is that I can just assign a stringification directly. When I access it, I get the "inflated" version back. I had thought I needed to inflate it before assigning, but I was wrong. All I needed to to, to preserve my sanity, was to put a constraint on the column that only tolerances, valid strings, and undef were allowed to be set.
That's not today's accomplishment, though, it's last week's.
Today, I was just polishing off the main input form for this application. I'm hoping to have the delivery meeting tomorrow. Basically all of the fields are either free text, numbers, or tolerances. A number of the text fields should be multiple choice, but in all cases those multiple choices are just guidelines, and users may need to enter one-off values. This is a stupidly common scenario, and is the reason that combo boxes exist.
Of course, they don't exist in HTML forms. I suppose that since I've gotten through ten years of HTML authoring without really hitting this wall, it's not as big a need as I thought, but it's still pretty obnoxious. All the JavaScript combo boxes I found out on the web stank. Most of them were text fields with dropdowns next to them. Picking from the dropdown sets the text field. Ugly! I know I could've done some kind of crazy box-drawing to simulate a full combo box, but I can't stand the look of box-drawn widgets. They remind me that things are a hack. So, I wrote my own little combo box.
It's nothing fancy. There's a dropdown box with an "(other)" selection. When that's selected, the box replaces itself with a text-entry field. If that field is left blank, the dropdown comes back. It works on MSIE, it works in Gecko, it works with WebKit, and it plugs nicely into my goofy "make a select element" code at work.
So, that's great!
I hesitate to admit that this took hours, mostly because MSIE is completely messed up. Everything worked everywhere but Win32 MSIE, and I had to rewrite quite a lot of code to make it work, adding something like 400 bytes to the script. (That's about 30% growth.) Mostly, I had problems because setAttribute didn't seem to want to set the "name" attribute on form inputs. I'm told it works, but it didn't work for me. Assigning to the "name" attribute directly, though, works just fine.
So, that done and plugged into the application, I'm finished with work for the day. Have a free combo box:
http://rjbs.manxome.org/hacks/js/combo.html
Re:firefox and combo box
thinc on 2004-08-31T05:15:23
<html>
<form id='form'>
<select id='line_dropdown' name='line' onChange='conditional_toggle(this)'>
<option value=''>(undefined)</option>
<option value='10'>ten</option>
<option value='20'>twenty</option>
<option value='30'>thirty</option>
<option value='!-@-!'>(other)</option>
</select>
<input type="text" name="line" id="line_input" style="display: none;" onblur='conditional_toggle(this)'/>
</form>
<script>
function conditional_toggle(el) {
var drop = document.getElementById("line_dropdown");
var inpt = document.getElementById("line_input");
if( can_be_seen( el ) && has_special_value( el ) )
{
toggle_view( drop );
toggle_view( inpt );
}
if( can_be_seen( drop ) && has_special_value( drop ) )
{
drop.options.selectedIndex = 0;
}
if( can_be_seen( inpt ) )
{
inpt.focus();
}
}
function can_be_seen(element)
{
if( element.style.display == 'none' )
return false;
return true;
}
function has_special_value(element)
{
if( element.tagName.toLowerCase() == "select" && element.options[element.selectedIndex].value == "!-@-!" )
{
return true;
}
if( element.tagName.toLowerCase() == "input" && element.value == "" )
{
return true;
}
return false;
}
function toggle_view(element) {
if( element.style.display == '' )
{
element.style.display = "none";
return;
}
element.style.display = '';
}
</script>
</html>Re:firefox and combo box
rjbs on 2004-08-31T11:14:32
I'd rather make the new one work in firefox than the old one in MSIE! What's the issue here? Is it the use of a non-standard attribute?
Also, because you're hiding the field and not removing it, it will submit its value, making the form processing logic uglier. It has to be removed or disabled (in WebKit, only the latter will work) to keep it from being submitted.Re:firefox and combo box
thinc on 2004-08-31T14:06:02
I was thinking the backend would recieve the same data if it were a multi-select, so it would not get too ugly. On the other hand disabling it would be easy, element.disable = true;
Adding and removing elements from the dom has always been a cross browser pain.
Still Choked Opera 7.25
n1vux on 2004-09-01T23:04:31
Wednesday night, same result. Opera 7.25 on Z6k, window close when I click (other).
posted thumb typing on the Z so I won~t forget
bill