m.attrs.bidi

Bi-directional binding for Mithril!

As a custom attribute (requires custom attribute fork):

m( 'input', {
	bidi : valueProp
} )

Custom attribute demo.

...Or as a component (ensures lexical reference):

bidi( {}, m( 'input' ), valueProp )

Component demo

Gimme!

# NPM
npm install m.attrs.bidi --save

# Bower
bower install m.attrs.bidi --save

The plugin will attach itself as m.attrs.bidi and return / export / expose the same object as a module. The entity in question is both a component and a transformation function that works as a custom attribute.

// Node / Browserify
var bidi = require( 'm.attrs.bidi' )

// ES6
import bidi from 'm.attrs.bidi'

// RequireJS
require( [ 'm.attrs.bidi' ], function( bidi ){
	/* ... */
} )

// HTML
<script src="https://cdn.rawgit.com/barneycarroll/m.attrs.bidi/master/bidi.js"></script>
<script>
 window.bidi = m.attrs.bidi;
</script>

How

Dropdowns

Dropdowns will need their options passed in as normal.

m( 'select', {
	bidi : valueProp
},
	list.map( function( item ){
		return m( 'option', item )
	} )
)

Radio buttons

In the same way, radio buttons need to have values specified

m( 'input[type=radio]', {
	bidi  : valueProp,
	value : item1
} ),
m( 'input[type=radio]', {
	bidi  : valueProp,
	value : item2
} )

Checkboxes

m( 'input[type=checkbox]', {
	bidi : valueProp
} )

Custom attributes?

Custom attributes are a feature request for Mithril. You may be interested in the Github discussion, and in the fork of Mithril that implements the proposal.