HtmlInput Module

class epyk.core.html.HtmlInput.AutoComplete(page, text, placeholder, width, height, html_code, options, attrs, profile)

focus(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None, options: Optional[dict] = None, source_event: Optional[str] = None, on_ready: bool = False)

Action on focus.

Parameters:

js_funcs – Optional. Javascript functions
profile – Optional. A flag to set the component performance storage
options – Optional. Specific Python options available for this component
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property js: Autocomplete

The Javascript functions defined for this component.

Those can be specific ones for the module or generic ones from the language.

property options: OptionAutoComplete

Property to set all the input TimePicker component properties.

Related Pages:

https://timepicker.co/options/

property style: ClassInputAutocomplete: Property to the CSS Style of the component.

class epyk.core.html.HtmlInput.Field(page: PageModel, html_input, label, icon, width, height, html_code, helper, options, profile)

property dom: JsHtmlFields

The HTML Dom object linked to this component.

Returns:: A Javascript Dom object

class epyk.core.html.HtmlInput.FieldAutocomplete(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

change(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Event triggered when the value of the input field changes.

A Date object containing the selected time is passed as the first argument of the callback. Note: the variable time is a function parameter received in the Javascript side.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-change

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

close(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Triggered when the menu is hidden. Not every close event will be accompanied by a change event.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-close

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

focus(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Triggered when focus is moved to an item (not selecting).

The default action is to replace the text field’s value with the value of the focused item, though only if the event was triggered by a keyboard interaction. Canceling this event prevents the value from being updated, but does not prevent the menu item from being focused.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-focus

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

response(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Triggered after a search completes, before the menu is shown.

Useful for local manipulation of suggestion data, where a custom source option callback is not required. This event is always triggered when a search completes, even if the menu will not be shown because there are no results or the Autocomplete is disabled.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-response

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

search(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Triggered before a search is performed, after minLength and delay are met.

If canceled, then no request will be started and no items suggested.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-search

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

select(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None)

Triggered when an item is selected from the menu.

The default action is to replace the text field’s value with the value of the selected item. Canceling this event prevents the value from being updated, but does not prevent the menu from closing.

Related Pages:

https://api.jqueryui.com/autocomplete/#event-select

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage

class epyk.core.html.HtmlInput.FieldCheckBox(page: PageModel, value, label, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldFile(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldInput(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldInteger(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldPassword(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldRange(page: PageModel, value, min_val, max_val, step, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldSelect(page: PageModel, value, label, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.FieldTextArea(page: PageModel, value, label, placeholder, icon, width, height, html_code, helper, options, profile)

class epyk.core.html.HtmlInput.Input(page: PageModel, text, placeholder, width, height, html_code, options, attrs, profile)

change(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

The input event fires when the value of an <input>, <select>, or <textarea> element has been changed.

Related Pages:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property dom: Inputs

Return all the Javascript functions defined for an HTML Input Component.

Those functions will use plain javascript available for a DOM element by default.

Usage:

div = page.ui.input(htmlCode="testDiv")
print(div.dom.content)

Returns:: A Javascript Dom object.

enter(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Add an javascript action when the key enter is pressed on the keyboard.

Usage:

component.input(placeholder="Put your tag").enter("alert()")

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

Returns:

The python object itself.

focus(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None, options: Optional[dict] = None, source_event: Optional[str] = None, on_ready: bool = False)

Action on focus.

Parameters:

js_funcs – Optional. Javascript functions
profile – Optional. A flag to set the component performance storage
options – Optional. Specific Python options available for this component
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property js: InputText: Specific Javascript function for the input object.

leave(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Add a javascript action when the key enter is pressed on the keyboard.

Usage:

component.input(placeholder="Put your tag").enter("alert()")

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

Returns:

The python object itself.

property options: OptionsInput: Property to set all the input component properties.

readonly(flag: bool = True)

Set the input component to be readonly.

Related Pages:

https://www.w3schools.com/tags/att_input_readonly.asp

Parameters:: flag – Optional. Add the HTML readonly tag to the component

property style: ClassInput: Property to the CSS Style of the component.

validation(pattern: Optional[str] = None, required: bool = True)

Add validation rules on the input component.

Related Pages:

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern https://www.w3schools.com/tags/att_input_pattern.asp

Usage:

input.validation(pattern="[0-9]{5}")

Parameters:

pattern – Optional. Specifies a regular expression that the <input> element’s value is checked against
required – Optional. The Boolean required attribute, if present, indicates that the user must specify a value for the input before the owning form can be submitted.

Returns:

Self to allow the chaining

validation_from(values, css_cls=None, disclaimer: str = '⚠ Error - Invalid value', css_disclaimer: Optional[dict] = None, on_enter: bool = True)

Run more sophisticated validation checks using list or remote services.

Related Pages:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity

Usage:

inp = page.ui.input(html_code="auto")
request = page.js.post("/validation", components=[inp])
inp.validation_from(request)

Parameters:

values – Can be a list of items or a XMLHttp request
css_cls – The CSS class for the input when validation error
disclaimer – The disclaimer text
css_disclaimer – CSS attributes for the disclaimer
on_enter – If true, trigger the value when enter is pressed

class epyk.core.html.HtmlInput.InputDate(page: PageModel, records, placeholder, width, height, html_code, options, attrs, profile)

property dom: JsHtmlDatePicker: The Javascript Dom object.

excluded_dates(dts: Optional[List[str]] = None, js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, dataflows: Optional[List[dict]] = None, profile: Optional[Union[bool, dict]] = None)

List of dates to be excluded from the available dates in the DatePicker component.

Parameters:

dts – Optional. Dates excluded format YYYY-MM-DD
js_funcs – Optional. Javascript functions
dataflows – Optional. Chain of data transformations
profile – Optional. Set to true to get the profile for the function on the Javascript console

format_dates(class_name: str, dts: Optional[List[str]] = None, css: Optional[dict] = None, tooltip: str = '', profile: Optional[Union[bool, dict]] = None, dataflows: Optional[List[dict]] = None)

Change the CSS style for some selected dates in the DateIicker.

This function can be also used on the Javascript side from the js property.

Parameters:

class_name – The name of the CSS added to the page with the CSS attributes
dts – Optional. A list of dates format YYYY-MM-DD
css – Optional. The CSS Attributes for the CSS class
tooltip – Optional. The tooltip when the mouse is hover
profile – Optional. Set to true to get the profile for the function on the Javascript console
dataflows – Chain of data transformations

included_dates(dts: Optional[List[str]] = None, selected: Optional[str] = None, js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, dataflows: Optional[List[dict]] = None, profile: Optional[Union[bool, dict]] = None)

Define some specific date to be the only ones available from the DatePicker component.

Parameters:

dts – Optional. Dates included format YYYY-MM-DD
selected – Optional. The selected date from the range. Default max
js_funcs – Optional. Javascript functions
dataflows – Optional. Chain of data transformations
profile – Optional. Set to true to get the profile for the function on the Javascript console

property js: Datepicker

The Javascript functions defined for this component.

Those can be specific ones for the module or generic ones from the language.

property options: OptionsDatePicker

Property to set all the input DatePicker component properties.

Related Pages:

https://timepicker.co/options/

property style: ClassInputDate: Property to the CSS Style of the component.

class epyk.core.html.HtmlInput.InputInteger(page: PageModel, text, placeholder, width, height, html_code, options, attrs, profile)

property options: OptionsInputInteger: Property to set all the input component properties.

quantity()

Add quantity shortcuts to the component.

This will then check the input and remap if they are K, M and B to the corresponding value.

class epyk.core.html.HtmlInput.InputRadio(page: PageModel, flag: bool, group_name: str, placeholder: str, width: tuple, height, html_code, options, attrs, profile)

class epyk.core.html.HtmlInput.InputRange(page: PageModel, text, min_val, max_val, step, placeholder, width, height, html_code, options, attrs, profile)

property options: OptionsInputRange: Property to set input range properties.

property style: ClassInputRange: Property to the CSS Style of the component.

class epyk.core.html.HtmlInput.InputTime(page: PageModel, text, placeholder, width, height, html_code, options, attrs, profile)

change(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Event triggered when the value of the input field changes.

A Date object containing the selected time is passed as the first argument of the callback. Note: the variable time is a function parameter received in the Javascript side.

Related Pages:

https://timepicker.co/options/

Parameters:

js_funcs – A Javascript Python function
profile – Optional. Set to true to get the profile for the function on the Javascript console
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property dom: JsHtmlTimePicker: The Javascript Dom object.

property js: Timepicker

The Javascript functions defined for this component.

Those can be specific ones for the module or generic ones from the language.

property options: OptionsTimePicker

Property to set all the input TimePicker component properties.

Related Pages:

https://timepicker.co/options/

property style: ClassInputTime: Property to the CSS Style of the component.

class epyk.core.html.HtmlInput.Output(page: PageModel, vals, html_code: Optional[str] = None, options: Optional[Union[bool, dict]] = None, profile: Optional[Union[List[Union[str, JsDataModel]], str]] = None, css_attrs: Optional[dict] = None)

class epyk.core.html.HtmlInput.Radio(page: PageModel, flag, label, group_name, icon, width, height, html_code, helper, options, profile)

property dom: Radio

Return all the Javascript functions defined for an HTML Component.

Those functions will use plain javascript by default.

property js: Radio

The Javascript functions defined for this component.

Those can be specific ones for the module or generic ones from the language.

class epyk.core.html.HtmlInput.Search(page: PageModel, text, placeholder, color, width, height, html_code, tooltip, extensible, options, profile)

click(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Parameters:

js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property dom: JsHtmlFields

Return all the Javascript functions defined for an HTML Component.

Those functions will use plain javascript by default.

enter(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Add an javascript action when the key enter is pressed on the keyboard.

Usage:

component.enter(" alert() ")

Parameters:

js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

Returns:

The python object itself

class epyk.core.html.HtmlInput.TextArea(page: PageModel, text, width, rows, placeholder, background_color, html_code, options, profile)

change(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

The input event fires when the value of an <input>, <select>, or <textarea> element has been changed.

Related Pages:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event

Parameters:

js_funcs – Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

property dom: Textarea

Return all the Javascript functions defined for an HTML Component.

Those functions will use plain javascript by default.

Related Pages:

https://www.w3schools.com/js/js_htmldom.asp

enter(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False)

Add a javascript action when the key enter is pressed on the keyboard.

Usage:

component.enter(" alert() ")

Parameters:

js_funcs – The Javascript functions
profile – Optional. A flag to set the component performance storage
source_event – Optional. The JavaScript DOM source for the event (can be a sug item)
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded

Returns:

The python object itself

property options: OptionsTextarea: Property to set all the input component properties.

selectable(js_funcs: Optional[Union[List[Union[str, JsDataModel]], str]] = None, profile: Optional[Union[bool, dict]] = None)

Parameters:

js_funcs – Optional. Javascript functions
profile – Optional. A flag to set the component performance storage

Returns:

self. to allow the function chaining

validation(pattern: str, required: bool = True)

Add validation rules on the input component.

Usage:

input.validation(pattern="[0-9]{5}")

Parameters:

pattern –
required – Optional.

Returns:

Self to allow the chaining

validation_from(values, css_cls=None, disclaimer='⚠ Error - Invalid value', css_disclaimer: Optional[dict] = None, on_enter: bool = True)

Run more sophisticated validation checks using list or remote services.

Usage:

inp = page.ui.input(html_code="auto")
request = page.js.post("/validation", components=[inp])
inp.validation_from(request)

Parameters:

values – Can be a list of items or a XMLHttp request
css_cls – Optional. The CSS class for the input when validation error
disclaimer – Optional. The disclaimer text
css_disclaimer – Optional. CSS attributes for the disclaimer
on_enter – Optional. If trye, trigger the value when enter is pressed