Table of Contents

Class EditContext

Namespace
CSharpToJavaScript.APIs.JS
Assembly
CSharpToJavaScript.dll
NOTE
Experimental
The EditContext interface represents the text edit context of an element that was made editable by using the {{domxref("EditContext API", "", "", "nocode")}}. 
[Value("EditContext")]
public class EditContext : EventTarget
Inheritance
EditContext
Inherited Members

Remarks

The {{domxref("EditContext API", "", "", "nocode")}} can be used to build rich text editors on the web that support advanced text input experiences, such as Input Method Editor (IME) composition, emoji picker, or any other platform-specific editing-related UI surfaces.

See also on MDN

Constructors

EditContext() 

public EditContext()

EditContext(EditContextInit)

NOTE
Experimental
The EditContext() constructor returns a new EditContext object. 
public EditContext(EditContextInit options = null)

Parameters

options EditContextInit

Remarks

-The EditContext interface it belongs to.

See also on MDN

Properties

CharacterBoundsRangeStart

NOTE
Experimental
The characterBoundsRangeStart read-only property of the EditContext interface indicates the index of the character, within the editable text content, that corresponds to the first item in the CharacterBounds() array. 
[Value("characterBoundsRangeStart")]
public ulong CharacterBoundsRangeStart { get; }

Property Value

ulong

A Number.

Remarks

For example, if the EditContent contains the characters abc, and if characterBoundRangeStart is 1, the first item in the characterBounds array contains the bounds for the character b.

See also on MDN

Oncharacterboundsupdate 

[Value("oncharacterboundsupdate")]
public EventHandlerNonNull Oncharacterboundsupdate { get; set; }

Property Value

EventHandlerNonNull

Oncompositionend 

[Value("oncompositionend")]
public EventHandlerNonNull Oncompositionend { get; set; }

Property Value

EventHandlerNonNull

Oncompositionstart 

[Value("oncompositionstart")]
public EventHandlerNonNull Oncompositionstart { get; set; }

Property Value

EventHandlerNonNull

Ontextformatupdate 

[Value("ontextformatupdate")]
public EventHandlerNonNull Ontextformatupdate { get; set; }

Property Value

EventHandlerNonNull

Ontextupdate 

[Value("ontextupdate")]
public EventHandlerNonNull Ontextupdate { get; set; }

Property Value

EventHandlerNonNull

SelectionEnd

NOTE
Experimental
The selectionEnd read-only property of the EditContext refers to the offset, within the editable text content, of the end of the current selection. 
[Value("selectionEnd")]
public ulong SelectionEnd { get; }

Property Value

ulong

A Number

Remarks

See also on MDN

SelectionStart

NOTE
Experimental
The selectionStart read-only property of the EditContext refers to the offset, within the editable text content, of the start of the current selection. 
[Value("selectionStart")]
public ulong SelectionStart { get; }

Property Value

ulong

A Number

Remarks

See also on MDN

Text

NOTE
Experimental
The text read-only property of the EditContext interface represents the editable content of the element. 
[Value("text")]
public string Text { get; }

Property Value

string

A string containing the current editable content of the element that's attached to the EditContext object. Its initial value is the empty string.This string may or may not be equal to the value of the TextContent property of the DOM element that's associated to the EditContext. The associated element might, for example, be a <canvas> element, which doesn't have a textContent property. Or, the associated element might be a <div> element that contains text that's different than the EditContext.text value, for more advanced rendering.The text property of the EditContext object can be used as the model for the editable text region. Other properties of the EditContext object, such as selectionStart and selectionEnd refer to offsets within the text string.

Remarks

See also on MDN

Methods

AttachedElements()

NOTE
Experimental
The attachedElements() method of the EditContext interface returns an {{jsxref("Array")}} that contains only one item. This item is the element that's associated with the EditContext object. 
[Value("attachedElements")]
public List<HTMLElement> AttachedElements()

Returns

List<HTMLElement>

An {{jsxref("Array")}} containing one HTMLElement object.There can only be one element associated to an EditContext instance, so the returned array will always contain one element. If the API is extended in the future to support multiple associated elements, the return value will be an array containing multiple elements.

Remarks

-The EditContext interface it belongs to.

See also on MDN

CharacterBounds()

NOTE
Experimental
The characterBounds() method of the EditContext interface returns an {{jsxref("Array")}} containing the list of bounding rectangles for the characters in the EditContext object. 
[Value("characterBounds")]
public List<DOMRect> CharacterBounds()

Returns

List<DOMRect>

An {{jsxref("Array")}} containing DOMRect objects.

Remarks

The position and size of the characters in an EditContext object is used by the operating system to correctly position platform-specific editing-related UI surfaces such as an Input Method Editor (IME) window when needed. This is especially important in situations where the operating system can't automatically detect the position and size of the characters, such as when rendering text in a &lt;canvas&gt; element.

Web developers will most likely be interested in using the EditContext.Characterboundsupdate event together with the UpdateCharacterBounds(ulong, List<DOMRect>) method to update the character bounds when the operating system indicates that it requires information about the position and size of the characters.

The characterBounds() method returns the list of character bounds that were last updated with updateCharacterBounds(). The list doesn&apos;t contain an item for every character in the EditContext object, only for the characters that were updated with updateCharacterBounds(). To know where the characters are located in the EditContext object, use the CharacterBoundsRangeStart property.

-The EditContext interface it belongs to.

See also on MDN

UpdateCharacterBounds(ulong, List<DOMRect>)

NOTE
Experimental
The EditContext.updateCharacterBounds() method of the EditContext interface should be called as response to a EditContext.Characterboundsupdate event to inform the operating system about the position and size of the characters in the EditContext object. 
[Value("updateCharacterBounds")]
public GlobalObject.Undefined UpdateCharacterBounds(ulong rangeStart, List<DOMRect> characterBounds)

Parameters

rangeStart ulong
characterBounds List<DOMRect>

Returns

GlobalObject.Undefined

None (undefined).

Remarks

The characterboundsupdate event is the only time you need to call the updateCharacterBounds() method.

The character bounds information is then used by the operating system to correctly position the Input Method Editor (IME) window when needed. This is especially important in situations where the operating system can't automatically detect the position and size of the characters, such as when rendering text in a &lt;canvas&gt; element.

-The EditContext interface it belongs to.

See also on MDN

UpdateControlBounds(DOMRect)

NOTE
Experimental
The EditContext.updateControlBounds() method of the EditContext interface is used to inform the operating system about the position and size of the editable text region of the EditContext object. 
[Value("updateControlBounds")]
public GlobalObject.Undefined UpdateControlBounds(DOMRect controlBounds)

Parameters

controlBounds DOMRect

Returns

GlobalObject.Undefined

None (undefined).

Remarks

Call this method to tell the operating system the bounds of the current editable region. You should call it when initializing the EditContext, and whenever the editable region's bounds change such as when the webpage is resized. These bounds are used to position platform-specific editing-related UI surfaces such as an Input Method Editor (IME) window.

-The EditContext interface it belongs to.

See also on MDN

UpdateSelection(ulong, ulong)

NOTE
Experimental
The updateSelection() method of the EditContext interface updates the internal state of the selection within the editable text context. This method is used to update the selection state when the user interacts with the text rendering in the EditContext&apos;s associated element, such as by clicking or dragging the mouse, or by using the keyboard. 
[Value("updateSelection")]
public GlobalObject.Undefined UpdateSelection(ulong start, ulong end)

Parameters

start ulong
end ulong

Returns

GlobalObject.Undefined

None (undefined).

Remarks

-The EditContext interface it belongs to.

See also on MDN

UpdateSelectionBounds(DOMRect)

NOTE
Experimental
The EditContext.updateSelectionBounds() method of the EditContext interface is used to inform the operating system about the bounds of the text selection within the editable region that's associated with the EditContext object. 
[Value("updateSelectionBounds")]
public GlobalObject.Undefined UpdateSelectionBounds(DOMRect selectionBounds)

Parameters

selectionBounds DOMRect

Returns

GlobalObject.Undefined

None (undefined).

Remarks

Call this method to tell the operating system the bounds of the user&apos;s current selection. You should call the method whenever the user&apos;s selection changes in the editable region. The selection bounds are used by the operating system to help position the IME window or any other platform-specific editing-related UI surfaces.

-The EditContext interface it belongs to.

See also on MDN

UpdateText(ulong, ulong, string)

NOTE
Experimental
The updateText() method of the EditContext interface updates the internal text content of an EditContext object. 
[Value("updateText")]
public GlobalObject.Undefined UpdateText(ulong rangeStart, ulong rangeEnd, string text)

Parameters

rangeStart ulong
rangeEnd ulong
text string

Returns

GlobalObject.Undefined

None (undefined).

Remarks

This method doesn&apos;t need to be used when the user types text in the associated element. The EditContext object will automatically update its internal text content, and will fire EditContext.Textupdate events as needed.

This method can, however, be used when the user interacts with the text content in other ways, such as when pasting text from the clipboard.

-The EditContext interface it belongs to.

See also on MDN

Edit this page