Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improvement: Option label as a link #66

Merged
merged 5 commits into from
Feb 20, 2015

Conversation

nomadrat
Copy link
Contributor

Hi there. In my projects i use your component and i want to suggest little improvement.

Description: Add more possibilities for developers to customize react-select component. For example: when a user clicks on the label, I want description page to be opened. We also wrap the label into <a> tag so the developer can customize it.

Parameter name Description Default value
onOptionLabelClick function (Object option, Object event) undefined

Usage example:

var SelectedValuesField = React.createClass({
    onLabelClick: function (option, event) {
        console.log(option.value);
    },

    render: function() {
        var ops = [
            { label: 'A238 - Account1', value: 'a238' },
            { label: 'Vanilla', value: 'vanilla' },
            { label: 'Strawberry', value: 'strawberry' },
            { label: 'Caramel', value: 'caramel' }
        ];

        return (
            <div>
                <label>{this.props.label}</label>
                <ReactSelect
                    onOptionLabelClick={this.onLabelClick}
                    value="a238,vanilla,strawberry"
                    multi={true}
                    options={ops} />
            </div>
        );
    }
});

Preview:
screen-shot-2015-02-18-at-11 55 12-am

@nomadrat nomadrat changed the title Option label as a link improvement Improvement: Option label as a link Feb 18, 2015
@JedWatson
Copy link
Owner

Thanks @dmitry-smirnov! This looks really good, and it's something I've been meaning to add myself.

JedWatson added a commit that referenced this pull request Feb 20, 2015
@JedWatson JedWatson merged commit b3d2564 into JedWatson:master Feb 20, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants