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

ion-select fires on keyboard return key #5596

Closed
rmont66 opened this issue Feb 24, 2016 · 1 comment
Closed

ion-select fires on keyboard return key #5596

rmont66 opened this issue Feb 24, 2016 · 1 comment
Assignees
Milestone

Comments

@rmont66
Copy link

rmont66 commented Feb 24, 2016

Short description of the problem:

I have a form with a ion-select element, when trying to submit the form through the submit button work find, however, trying to submit the form with the enter key triggers an error.

What behavior are you expecting?

No errors.

Steps to reproduce:

  1. Create a form
  2. Add an ion-input element
  3. add an ion-select element
  4. add submit button
  5. send form with return key.
<form [ngFormModel]="authForm" (ngSubmit)="onSubmit(authForm.value)">
        <ion-list padding-vertical class="">
            <ion-item>
                <ion-input placeholder='{{ "SEARCH_TZADIK_PH" | translate }}' [ngFormControl]="s" type="text"></ion-input>
            </ion-item>
            <ion-item class="no-border">
                <ion-label>{{ "MONTH" | translate }}</ion-label>
                <ion-select multiple="true"  [ngFormControl]="month">
                    <ion-option value="{{month?.key}}" *ngFor="#month of months">{{month?.month}}</ion-option>
                </ion-select>
            </ion-item>
            <button full block class="no-margin" type="submit">Find</button>
        </ion-list>
    </form>

Ionic Version: 2.x

Browser & Operating System: iOS / Android / Chrome

Run ionic info from terminal/cmd prompt:

Cordova CLI: 6.0.0
Gulp version:  CLI version 3.9.0
Gulp local:  
Ionic Version: 2.0.0-beta.1
Ionic CLI Version: 2.0.0-beta.17
Ionic App Lib Version: 2.0.0-beta.8
ios-deploy version: 1.8.5 
ios-sim version: 5.0.6 
OS: Mac OS X El Capitan
Node Version: v5.0.0
Xcode version: Xcode 7.2 Build version 7C68 

Digging into the code in file ../node_modules/ionic-framework/components/select/select.js

Select.prototype._click = function (ev) {

        if(ev.detail == 0){//// adding this 3 lines solves the problem
            return;
        }
        var _this = this;

Sorry but I really don't have very clear how to do a pull request.

@adamdbradley adamdbradley self-assigned this Feb 25, 2016
@adamdbradley adamdbradley added this to the 2.0.0-beta.3 milestone Feb 25, 2016
adamdbradley added a commit that referenced this issue Mar 5, 2016
@adamdbradley
Copy link
Contributor

Great find and fix, thanks! I updated it like you said where it won't open up the select if it has detail===0. I also updated it so the select can open by using the spacebar when focused, like a native HTML select element. However, there's still more work to be done to improve it's accessibility. But thanks for reporting the bug!

@ionitron-bot ionitron-bot bot locked and limited conversation to collaborators Sep 7, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants