menuMDUIDocs
color_lens
The new mdui 2 based on Material Design 3 and Web Components is now available. Check out the mdui 2 documentation.

JavaScript Global Methods

mdui.mutation()

In mdui, some components need to be initialized once the DOM is fully loaded. Consequently, dynamically generated components cannot be automatically initialized. To address this, mdui provides the mdui.mutation() method.

mdui.mutation()

Calling this method will initialize all components on the page that have not yet been initialized.

var html =
  '<select class="mdui-select" mdui-select>' +
  '  <option value="1">State 1</option>' +
  '  <option value="2">State 2</option>' +
  '  <option value="3">State 3</option>' +
  '</select>';

// A Select component was added dynamically, but since it is called via custom attributes, it cannot be automatically initialized.
$('body').append(html);

// Call this method to initialize all uninitialized components on the page.
mdui.mutation();

mdui.mutation(selector, apiInit)

If two parameters are passed to mdui.mutation(), it can be used to initialize components you have written yourself. The first parameter is a CSS selector, and the second is an initialization function.

When calling mdui.mutation(selector, apiInit), the CSS selector and the initialization function are bound, and $(selector).each(apiInit) is executed to invoke the initialization function.

The next time mdui.mutation() is called, if the components corresponding to the CSS selector have not yet been initialized, the initialization function will be called automatically.

$(selector).mutation()

If you need to initialize components within a specific element, you can call $(selector).mutation(). This method will initialize uninitialized components within the selector and its child elements.