recursal/MDN huggingface dataset:
HTMLFormElement: requestSubmit() method
=======================================

 The `HTMLFormElement` method **`requestSubmit()`** requests
 that the form be submitted using a specific submit button.

Syntax
------


```js
requestSubmit()
requestSubmit(submitter)
```

### Parameters

`submitter` Optional

A submit button that is a member of the form.

If the `submitter` specifies `form*` attributes, they will override the form's submission behavior (e.g. `formmethod="POST"`).

If the `submitter` has a `name` attribute or is an `<input type="image">`, its data will be included in the form submission (e.g. `btnName=btnValue`).

If you omit the `submitter` parameter, the form element itself is used as the submitter.

### Return value

None (`undefined`).

### Exceptions

`TypeError`

Thrown if the specified `submitter` is not a submit button.

`NotFoundError` `DOMException`

 Thrown if the specified `submitter` isn't a member of the form on
 which `requestSubmit()` was called. The submitter must be either a
 descendant of the form element or must have a `form`
 attribute referring to the form.


Usage notes
-----------

 The obvious question is: Why does this method exist, when we've had the
 `submit()` method since the dawn of time?

 The answer is simple. `submit()` submits the form, but that's all it
 does. `requestSubmit()`, on the other hand, acts as if a submit button were
 clicked. The form's content is validated, and the form is submitted only if validation
 succeeds. Once the form has been submitted, the
 `submit` event is sent back to the form
 object.

Examples
--------

 In the example below, the form is submitted by attempting to send the request using
 `requestSubmit()` if it's available. If a submit button with the
 ID `main-submit` is found, that's used to submit the form. Otherwise, the
 form is submitted with no `submitter` parameter, so it's submitted directly
 by the form itself.

 If, on the other hand, `requestSubmit()` isn't available, this code falls
 back to calling the form's `submit()` method.


```js
let myForm = document.querySelector("form");
let submitButton = myForm.querySelector("#main-submit");

if (myForm.requestSubmit) {
  if (submitButton) {
    myForm.requestSubmit(submitButton);
  } else {
    myForm.requestSubmit();
  }
} else {
  myForm.submit();
}
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-requestsubmit-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: reportValidity() method
========================================

Baseline 2023
-------------

Newly availableSince March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback

 The **`HTMLFormElement.reportValidity()`** method returns
 `true` if the element's child controls satisfy their validation constraints.
 When `false` is returned, cancelable
 `invalid` events are fired for
 each invalid child and validation problems are reported to the user.

Syntax
------


```js
reportValidity()
```

### Return value

`true` or `false`

Example
-------


```js
document.forms["myform"].addEventListener(
  "submit",
  () => {
    document.forms["myform"].reportValidity();
  },
  false,
);
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-cva-reportvalidity-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: formdata event
===============================

The **`formdata`** event fires after the entry list representing the form's data is constructed. This happens when the form is submitted, but can also be triggered by the invocation of a `FormData()` constructor.

This event is not cancelable and does not bubble.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("formdata", (event) => {});

onformdata = (event) => {};
```

Event type
----------

A `FormDataEvent`. Inherits from `Event`.

Event

FormDataEventEvent properties
----------------

*Inherits properties from its parent interface, `Event`.*

`FormDataEvent.formData`

Contains the `FormData` object representing the data contained in the form when the event was fired.

Examples
--------


```js
// grab reference to form

const formElem = document.querySelector("form");

// submit handler

formElem.addEventListener("submit", (e) => {
  // on form submission, prevent default
  e.preventDefault();

  console.log(formElem.querySelector('input[name="field1"]')); // FOO
  console.log(formElem.querySelector('input[name="field2"]')); // BAR

  // construct a FormData object, which fires the formdata event
  const formData = new FormData(formElem);
  // formdata gets modified by the formdata event
  console.log(formData.get("field1")); // foo
  console.log(formData.get("field2")); // bar
});

// formdata handler to retrieve data

formElem.addEventListener("formdata", (e) => {
  console.log("formdata fired");

  // modifies the form data
  const formData = e.formData;
  // formdata gets modified by the formdata event
  formData.set("field1", formData.get("field1").toLowerCase());
  formData.set("field2", formData.get("field2").toLowerCase());
});
```


The `onformdata` version would look like this:


```js
formElem.onformdata = (e) => {
  console.log("formdata fired");

  // modifies the form data
  const formData = e.formData;
  formData.set("field1", formData.get("field1").toLowerCase());
  formData.set("field2", formData.get("field2").toLowerCase());
};
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # event-formdata |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* HTML `<form>` element
* `FormDataEvent`
HTMLFormElement: enctype property
=================================

 The **`HTMLFormElement.enctype`** property is the MIME type of content that is used
 to submit the form to the server. Possible values are:

* `application/x-www-form-urlencoded`: The initial default type.
* `multipart/form-data`: The type that allows file `<input>`
 element(s) to upload file data.
* `text/plain`: Ambiguous format, human-readable content not reliably interpretable by computer.

 This value can be overridden by a `formenctype` attribute
 on a `<button>` or `<input>` element.

Value
-----

A string.

Examples
--------


```js
form.enctype = "application/x-www-form-urlencoded";
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-fs-enctype |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: target property
================================

 The **`target`** property of the `HTMLFormElement`
 interface represents the target of the form's action (i.e., the frame in which to render
 its output).

Value
-----

A string.

Examples
--------


```js
myForm.target = document.frames[1].name;
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-fs-target |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: submit() method
================================

 The **`HTMLFormElement.submit()`** method submits a given
 `<form>`.

 This method is similar, but not identical to, activating a form's submit
 `<button>`. When invoking this method directly, however:

* No `submit` event is raised. In particular, the form's `onsubmit` event handler is not run.
* Constraint validation is not triggered.

 The `HTMLFormElement.requestSubmit()` method is identical to activating a
 form's submit `<button>` and does not have these differences.

A form control (such as a submit button) with a `name` or `id` of `submit` will mask the form's `submit` method. Trying to call `myForm.submit();` throws an error "submit is not a function" because in this case `submit` refers to the form control which has a `name` or `id` of `submit`.

`<input>` with attribute type="submit" will not be submitted with the
 form when using **`HTMLFormElement.submit()`**, but it would be
 submitted when you do it with original HTML form submit.

Syntax
------


```js
submit()
```

### Parameters

None.

### Return value

None (`undefined`).

Examples
--------


```js
document.forms["myform"].submit();
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-submit-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: method property
================================

 The **`HTMLFormElement.method`** property represents the
 HTTP method used to submit the `<form>`.

Unless explicitly specified, the default method is 'get'.

Value
-----

A string.

Examples
--------


```js
document.forms["myform"].method = "post";

const formElement = document.createElement("form"); // Create a form
document.body.appendChild(formElement);
console.log(formElement.method); // 'get'
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-fs-method |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: action property
================================

 The **`HTMLFormElement.action`** property represents the action
 of the `<form>` element.

 The action of a form is the program that is executed on the server when the form is
 submitted. This property can be retrieved or set.

Value
-----

A string.

Examples
--------


```js
form.action = "/cgi-bin/publish";
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-fs-action |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: name property
==============================

 The **`HTMLFormElement.name`** property represents the name of
 the current `<form>` element as a string.

 If your `<form>` element contains an element named *name* then
 that element overrides the `form.name` property, so that you can't access it.

Value
-----

A string.

Examples
--------


```js
const form1name = document.getElementById("form1").name;

if (form1name !== document.form.form1) {
  // Browser doesn't support this form of reference
}
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-name |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: reset() method
===============================

 The **`HTMLFormElement.reset()`** method restores a form
 element's default values. This method does the same thing as clicking the form's
 `<input type="reset">` control.

 If a form control (such as a reset button) has a name or id of *reset* it will
 mask the form's reset method. It does not reset other attributes in the input, such as
 `disabled`.

 Note that if `setAttribute()` is called to set
 the value of a particular attribute, a subsequent call to `reset()` won't
 reset the attribute to its default value, but instead will keep the attribute at
 whatever value the `setAttribute()` call set it to.

Syntax
------


```js
reset()
```

### Parameters

None.

### Return value

None (`undefined`).

Examples
--------


```js
document.getElementById("myform").reset();
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-reset-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: acceptCharset property
=======================================

 The **`HTMLFormElement.acceptCharset`** property represents a
 list of the supported character encodings for the given `<form>` element. This list can be
 comma-separated or space-separated.

Value
-----

A string.

Examples
--------


```js
let inputs = document.forms["myform"].acceptCharset;
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-acceptcharset |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: length property
================================

 The **`HTMLFormElement.length`**
 read-only property returns the number of controls in the `<form>`
 element.

 You can access the list of the form's controls using the
 `elements` property.

 This includes both elements that are descendants of the `<form>`
 element as well as elements that are made members of the form using their
 `form` property.

 Elements that are considered for this property are: `<button>`,
 `<fieldset>`, `<input>` (with the exception
 that any whose type is "image" are omitted for historical reasons),
 `<object>`, `<output>`, `<select>`,
 and `<textarea>`.

Value
-----

A number.

Examples
--------


```js
if (document.getElementById("form1").length > 1) {
  // more than one form control here
}
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-form-length-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: reset event
============================

The **`reset`** event fires when a `<form>` is reset.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("reset", (event) => {});

onreset = (event) => {};
```

Event type
----------

A generic `Event`.

Examples
--------

This example uses `EventTarget.addEventListener()` to listen for form resets, and logs the current `Event.timeStamp` whenever that occurs.

### HTML


```html
<form id="form">
  <label>Test field: <input type="text" /></label>
  <br /><br />
  <button type="reset">Reset form</button>
</form>
<p id="log"></p>
```

### JavaScript


```js
function logReset(event) {
  log.textContent = `Form reset! Timestamp: ${event.timeStamp}`;
}

const form = document.getElementById("form");
const log = document.getElementById("log");
form.addEventListener("reset", logReset);
```

### Result

Specifications
--------------

| Specification |
| --- |
| HTML Standard # event-reset |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* HTML `<form>` element
ReadableStreamDefaultController: enqueue() method
=================================================

 The **`enqueue()`** method of the
 `ReadableStreamDefaultController` interface enqueues a given chunk in the
 associated stream.

Syntax
------


```js
enqueue(chunk)
```

### Parameters

`chunk`

The chunk to enqueue.

### Return value

None (`undefined`).

### Exceptions

`TypeError`

Thrown if the source object is not a `ReadableStreamDefaultController`.

Examples
--------

 In the following simple example, a custom `ReadableStream` is created using
 a constructor (see our Simple random stream example for the full code). The `start()` function generates a
 random string of text every second and enqueues it into the stream — see
 `controller.enqueue(string)`. A `cancel()` function is also
 provided to stop the generation if `ReadableStream.cancel()` is called for
 any reason.

 When a button is pressed, the generation is stopped, the stream is closed using
 `ReadableStreamDefaultController.close()`, and another function is run,
 which reads the data back out of the stream.


```js
let interval;
const stream = new ReadableStream({
  start(controller) {
    interval = setInterval(() => {
      let string = randomChars();

      // Add the string to the stream
      controller.enqueue(string);

      // show it on the screen
      let listItem = document.createElement("li");
      listItem.textContent = string;
      list1.appendChild(listItem);
    }, 1000);

    button.addEventListener("click", () => {
      clearInterval(interval);
      fetchStream();
      controller.close();
    });
  },
  pull(controller) {
    // We don't really need a pull in this example
  },
  cancel() {
    // This is called if the reader cancels,
    // so we should stop generating strings
    clearInterval(interval);
  },
});
```

Specifications
--------------

| Specification |
| --- |
| Streams Standard # ref-for-rs-default-controller-enqueue① |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Using readable streams
* `ReadableStreamDefaultController`
ReadableStreamDefaultController: close() method
===============================================

 The **`close()`** method of the
 `ReadableStreamDefaultController` interface closes the associated stream.

 Readers will still be able to read any previously-enqueued chunks from the stream,
 but once those are read, the stream will become closed. If you want to completely get
 rid of the stream and discard any enqueued chunks, you'd use
 `ReadableStream.cancel()` or
 `ReadableStreamDefaultReader.cancel()`.

Syntax
------


```js
close()
```

### Parameters

None.

### Return value

None (`undefined`).

### Exceptions

`TypeError`

Thrown if the source object is not a `ReadableStreamDefaultController`.

Examples
--------

 In the following simple example, a custom `ReadableStream` is created using
 a constructor (see our Simple random stream example for the full code). The `start()` function generates a
 random string of text every second and enqueues it into the stream. A
 `cancel()` function is also provided to stop the generation if
 `ReadableStream.cancel()` is called for any reason.

 When a button is pressed, the generation is stopped, the stream is closed using
 `ReadableStreamDefaultController.close()`, and another function is run,
 which reads the data back out of the stream.


```js
let interval;
const stream = new ReadableStream({
  start(controller) {
    interval = setInterval(() => {
      let string = randomChars();

      // Add the string to the stream
      controller.enqueue(string);

      // show it on the screen
      let listItem = document.createElement("li");
      listItem.textContent = string;
      list1.appendChild(listItem);
    }, 1000);

    button.addEventListener("click", () => {
      clearInterval(interval);
      fetchStream();
      controller.close();
    });
  },
  pull(controller) {
    // We don't really need a pull in this example
  },
  cancel() {
    // This is called if the reader cancels,
    // so we should stop generating strings
    clearInterval(interval);
  },
});
```

Specifications
--------------

| Specification |
| --- |
| Streams Standard # ref-for-rs-default-controller-close① |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Using readable streams
* `ReadableStreamDefaultController`
ReadableStreamDefaultController: error() method
===============================================

 The **`error()`** method of the
 `ReadableStreamDefaultController` interface causes any future interactions
 with the associated stream to error.


**Note:** The `error()` method can be called
 more than once, and can be called when the stream is not readable.


Syntax
------


```js
error(e)
```

### Parameters

`e`

The error you want future interactions to fail with.

### Return value

None (`undefined`).

### Exceptions

`TypeError`

Thrown if the source object is not a `ReadableStreamDefaultController`.

Examples
--------

 The A readable stream with an underlying push source and backpressure support example in the spec
 provides a good example of using
 `ReadablestreamDefaultController.desiredSize` to manually detect when the
 stream is full and apply backpressure, and also of using `error()` to
 manually trigger a stream error if another part of the system it relies on fails.

Specifications
--------------

| Specification |
| --- |
| Streams Standard # rs-default-controller-error |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Using readable streams
* `ReadableStreamDefaultController`
ReadableStreamDefaultController: desiredSize property
=====================================================

 The **`desiredSize`** read-only property of the
 `ReadableStreamDefaultController` interface returns the desired size
 required to fill the stream's internal queue.

Value
-----

An integer. Note that this can be negative if the queue is over-full.

Examples
--------

 The A readable stream with an underlying push source and backpressure support example in the spec
 provides a good example of using `desiredSize` to manually detect when the
 stream is full and apply backpressure, and also of using
 `ReadablestreamDefaultController.error()` to manually trigger a stream
 error if another part of the system it relies on fails.

Specifications
--------------

| Specification |
| --- |
| Streams Standard # ref-for-rs-default-controller-desired-size② |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Using readable streams
* `ReadableStreamDefaultController`
RTCSctpTransport: transport property
====================================

The **`transport`** read-only property of the `RTCSctpTransport` interface returns a `RTCDtlsTransport` object representing the DTLS transport used for the transmission and receipt of data packets.

Value
-----

A `RTCDtlsTransport` object representing the DTLS transport used for the transmission and receipt of data packets.

Specifications
--------------

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcsctptransport-transport |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `RTCSctpTransport`
RTCSctpTransport: statechange event
===================================

A **`statechange`** event is sent to an `RTCSctpTransport` to provide notification when the `RTCSctpTransport.state` property has changed.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("statechange", (event) => {});

onstatechange = (event) => {};
```

Event type
----------

A generic `Event`.

Examples
--------

Given an `RTCSctpTransport`, `transport`, and an `updateStatus()` function that presents connection state information to the user, this code sets up an event handler to let the user know when the transport is connected.


```js
pc.addEventListener(
  "statechange",
  (event) => {
    switch (transport.state) {
      case "connected":
        updateStatus("Connection started");
        break;
    }
  },
  false,
);
```


Using `onstatechange`, it looks like this:


```js
transport.onstatechange = (event) => {
  switch (transport.state) {
    case "connected":
      updateStatus("Connection started");
      break;
  }
};
```

Specifications
--------------

#### No specification found

No specification data found for `api.RTCSctpTransport.statechange_event`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* WebRTC API
* `RTCSctpTransport.state`