fix(alert): accepts any value (#16476)

fixes #16170
This commit is contained in:
Manu MA
2018-11-27 16:29:12 +01:00
committed by GitHub
parent 69f63b3849
commit 50b0c6f15d
4 changed files with 86 additions and 3 deletions

View File

@ -23,7 +23,7 @@ export interface AlertInput {
type?: TextFieldTypes | 'checkbox' | 'radio'; type?: TextFieldTypes | 'checkbox' | 'radio';
name?: string; name?: string;
placeholder?: string; placeholder?: string;
value?: string; value?: any;
label?: string; label?: string;
checked?: boolean; checked?: boolean;
disabled?: boolean; disabled?: boolean;

View File

@ -156,7 +156,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
type: i.type || 'text', type: i.type || 'text',
name: i.name || `${index}`, name: i.name || `${index}`,
placeholder: i.placeholder || '', placeholder: i.placeholder || '',
value: i.value || '', value: i.value,
label: i.label, label: i.label,
checked: !!i.checked, checked: !!i.checked,
disabled: !!i.disabled, disabled: !!i.disabled,

View File

@ -105,7 +105,7 @@ export class Radio implements ComponentInterface {
} }
componentWillLoad() { componentWillLoad() {
if (this.value == null) { if (this.value === undefined) {
this.value = this.inputId; this.value = this.inputId;
} }
this.emitStyle(); this.emitStyle();

View File

@ -0,0 +1,83 @@
<!DOCTYPE html>
<html dir="ltr">
<head>
<meta charset="UTF-8">
<title>Select - Basic</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../dist/ionic.js"></script>
</head>
<body>
<ion-app>
<ion-header>
<ion-toolbar>
<ion-title>Select - Conflict</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-item>
<ion-label>Alert</ion-label>
<ion-select id="alert" placeholder="Select One" interface="alert">
<ion-select-option class="s-unselected">Unselected</ion-select-option>
<ion-select-option class="s-zero">Zero</ion-select-option>
<ion-select-option class="s-empty">Empty String</ion-select-option>
<ion-select-option class="s-null">Null</ion-select-option>
</ion-select>
</ion-item>
<ion-item>
<ion-label>Action-sheet</ion-label>
<ion-select id="action" placeholder="Select One" interface="action-sheet">
<ion-select-option class="s-unselected">Unselected</ion-select-option>
<ion-select-option class="s-zero">Zero</ion-select-option>
<ion-select-option class="s-empty">Empty String</ion-select-option>
<ion-select-option class="s-null">Null</ion-select-option>
</ion-select>
</ion-item>
<ion-item>
<ion-label>Popover</ion-label>
<ion-select id="popover" placeholder="Select One" interface="popover">
<ion-select-option class="s-unselected">Unselected</ion-select-option>
<ion-select-option class="s-zero">Zero</ion-select-option>
<ion-select-option class="s-empty">Empty String</ion-select-option>
<ion-select-option class="s-null">Null</ion-select-option>
</ion-select>
</ion-item>
<span id="results"></span>
</ion-list>
</ion-content>
<script>
Array.from(document.querySelectorAll('.s-unselected')).forEach(s => s.value = undefined);
Array.from(document.querySelectorAll('.s-zero')).forEach(s => s.value = 0);
Array.from(document.querySelectorAll('.s-empty')).forEach(s => s.value = '');
Array.from(document.querySelectorAll('.s-null')).forEach(s => s.value = null);
function updateValues() {
const alert = document.getElementById('alert').value;
const actionSheet = document.getElementById('action').value;
const popover = document.getElementById('popover').value;
document.getElementById('results').textContent = `
Alert: ${alert}
Action-sheet: ${actionSheet}
Popover: ${popover}
`;
}
document.addEventListener('ionChange', () => updateValues());
</script>
</ion-app>
</body>
</html>