Input boxes rather than drop down for time period

Scheduler ASP.NET MVC
#1

Hi,

Is it possible to have input boxes rather than a drop down for the time period? we have users who are working on tablets and do not want to have to scroll through a drop down, they want to enter this in an input box rather.

What is the best way to do this?

Thank you

#2

Hi,
have you checked time control with a minicalendar?
scheduler-net.com/docs/lightbox. … e_lightbox

Here is the demo scheduler-net.com/demo_form.aspx
However, it still uses dropdowns for a time time selectors.

There is no designed way to change them. One possible solution is to implement a custom time control.
In this case, most of the coding will happen on the client-side
docs.dhtmlx.com/scheduler/custom … ditor.html

On the server you’ll have to define a class for a new control, in order to be able to add it to the config. Class must be inherited from the LightboxField, or the LightboxTime.
Declaration may look following:public class CustomTimeControl : LightboxTime { public CustomTimeControl(string name, string label = null) : base(name, label) { this.Type = "custom_time";//Type must match type name used on the client } }

Client-side:scheduler.form_blocks["custom_time"]={ render:function(sns){ .... }, set_value:function(node,value,ev){ .... }, get_value:function(node,ev){ .... }, focus:function(node){} }

Alternative and may be an easier way is to alter html of the lightbox on the client.
Simply replace the DOM node of time selectors with some kind of input when the lightbox is opened. The control takes time from node.value property, so if you replace select with an input it should still work.
docs.dhtmlx.com/scheduler/api__s … event.html

#3

Perfect thank you!

I have managed to get the time as an input, to overwrite the drop down. My question now is, how do I use the date picker along side the inputs?

I have noticed that the date picker and the time drop down come as a package? I would like only the date picker to be added so that I can display it alongside the inputs.

I have put 4 small inputs next to each other, from_hr, from_min- to_hr, to_min. In a layout that a user will enter something like 20:30-21:30

I am able to pick these up perfectly, all i need is the date picker, one along side from, one along side to.

This is what i have:

scheduler.form_blocks[“display_custom_time”] = {
render: function (sns) {
return "
    

:
:
"; }, set_value: function (node, value, ev) { node.childNodes[1].value = value || ""; }, get_value: function (node, ev) { ev.duty_cycle_time_off = node.childNodes[1].value; return node.childNodes[1].value; }, focus: function (node) { var a = node.childNodes[1]; a.select(); a.focus(); } }

scheduler.config.lightbox.sections = [
{ name: “custom_time”, height: 30, map_to: “custom_time”, type: “display_custom_time” }
];

How would you suggest I add a calendar picker for from and a calendar picker for to? In the same line as the input boxes.

Thank you in advance!