How do I style the select list element? Here's my code as it is now...
$('.editableSelect').editable(function(value, settings) {
if (this.revert == value) {
this.reset();
return;
}
setSaveButtonRed(this);
setDescFromAccountCode(this, value);
return (value);
}, {
type: 'select',
submit: '<button type="submit" class="checkbookButton">OK</button>',
data: $('#accountCodesForSelect').val(),
cssclass: 'checkbookSelect',
//style: 'font-family: Verdana,Helvetica,Sans-Serif; font-size:0.75em; width:700px;',
tooltip: "Click to edit...."
});
and the class checkbookSelect looks like this...
.checkbookSelect
{
font-family:Verdana,Helvetica,Sans-Serif;
font-size:0.75em;
}
But when I click in the, in this case, the table cell (and jEditable fires) and the select list appears, it's not styled...
I'm thinking that the cssclass setting in jEditable is only for the span that jEditable creates and maybe doesn't apply to whatever input element it creates...so maybe the answer is to use a more specific jQuery selector and/or jQuery's live() method to choose the select list element and then apply the styling that way?
Note that I also tried using the style attribute/setting...it's commented out above.
BTW jEditable is an awesome script...and I've blogged abt how to set up datepicker and jEditable here...