1

I'm using an inline datebox in a side panel. Under some circumstances, I want to disable the control programatically. Following the API instructions, I did this (coffeescript):

$("#dateInput").datebox 'close'

but the control is still enabled and this returns 'false':

alert $("#dateInput").datebox 'getOption', 'disabled'

Suspecting that there was a mistake in the API doc, I looked at the datebox source and saw that there actually is a "disable" function, so I tried this:

$("#dateInput").datebox 'disable'

But again, no luck. Any suggestions?

J Plato
  • 888
  • 1
  • 8
  • 17

3 Answers3

2

Try:

// disable
$("#dataInput").parent("div").addClass("ui-disabled");

// enable
$("#dataInput").parent("div").removeClass("ui-disabled");

// toggle enable/disable
$("#dataInput").parent("div").toggleClass("ui-disabled");

JSFiddle

Sga
  • 3,608
  • 2
  • 36
  • 47
  • 1
    I think you would need to apply the ui-disabled class to the parent div (wrapper) of the input: $("#dataInput").parent("div").addClass("ui-disabled"); – ezanker Aug 04 '14 at 16:19
  • correct, I didn't check the icon on the right; answer edited - thanks @ezanker – Sga Aug 04 '14 at 19:54
  • Because the datebox control is inline and always visible, I need to disable the control itself, not the input. However, I used your approach and added the "ui-disabled" class to the appropriate "ui-datebox-container" and that worked perfectly. I didn't realize that the "disable" and "enable" functions operate on the input and not the control itself, and because the input is hidden, I couldn't see that it was behaving that way. Thanks!! – J Plato Aug 05 '14 at 04:14
  • Huh. Never even considered this use case. I'll get something put together to do this magically – J.T.Sage Aug 06 '14 at 06:01
  • That would be very useful! – J Plato Aug 07 '14 at 19:40
1

My apologies if this doesn't truly qualify as an answer, a comment didn't seem appropriate either.

I have added a hook to disable/enable to entire control contents when calling disable/enable.

It does not have any effect on scripted calls to the control, they will still take effect.

It's only in the newest of the new versions, but if you want to patch it back, the relavant line is here:

GitHub SHA: 0585b2cc...

Commit Lines:

  • 1270
  • 1279

(1270 && 1279) - it's exactly what you were already doing manually - you want to add / remove the "ui-state-disabled" class to 

this.d.mainWrap

in the functions:

  • enable
  • disable

Conviently, they appear last in the .CORE file, so at least they are easy to find.

Fwiw, that commit references the "next" big version change - simply put, DateBox was built on jQM-1.0 alpha 4 or so, with all of the markup that was required then - the new version is going to be 1.4.3 optimized, with as much of the 1.5.0 work done before we see an actual release. It will also dump "dialog" mode completly (jQM 1.5.0 will), and my "homebrew" popup method in favor of the "official" popups. Test drive is available here: Buggy, likely broken demo

J.T.Sage
  • 1,984
  • 14
  • 21
0

Not sure why 'disable' did not work for you. For me 'disable' and 'enable' work fine:

$(".enableDisable").on("click", function(){
    if ($(this).val() == "Enable") {           
        $("#dateInput").datebox("enable");
    } else {
        $("#dateInput").datebox("disable");
    }
});

Here is a working DEMO

ezanker
  • 24,628
  • 1
  • 20
  • 35
  • Thanks, ezanker -- see my clarification above. Needed to disable the control itself, since the datebox is inline. – J Plato Aug 05 '14 at 04:16