Search code examples
javascriptjqueryjquery-mobilejquery-pluginsdatebox

Cannot format time output


I'm using DateBox as a time picker control in my web application, and it works, but I'm having some trouble with formatting the time output.

The documentation on the site is pretty complete... or so it seems. It's as if some of the settings don't work at all.

I've tried using the timeOutput option to format the output string, but that doesn't seem to work at all.

Does anybody have experience using the DateBox plugin? Could I get some advice on formatting the time output string?

Here's the code I use to set up the TimeBox control:

$("input[type=time]").datebox({
    mode: "timebox",
    zindex: 2100,
    useNewStyle: true,
    centerHoriz: true,
    centerVert: true,
    useClearButton: true,
    overrideTimeFormat: 12
});

Thanks in advance.


Solution

  • The problem lies partially in my negligence and partially in the documentation's organization.

    At the very bottom of this page, there's a section labeled "Internationalization/Localization," where the option I've been trying to use, timeOutput, is located.

    What I didn't notice is that at the top of the list of options, there's a note that reads:

    NOTE:: To override, use overrideNameOfOption - e.g. overrideTimeFormat

    So, that said, it turns out that you do have to override the timeOutput option by setting it as follows:

    $("input[type=time]").datebox({
        mode: "timebox",
        zindex: 2100,
        useNewStyle: true,
        centerHoriz: true,
        centerVert: true,
        useClearButton: true,
        overrideTimeFormat: 12,
        overrideTimeOutput: "%l:%M %p"
    });