Diseño de material moderno cuadro de diálogo generador en JavaScript puro-duDialog

Vista prévia

Descripción

duDialog es un plugin de JavaScript puro para crear material Design inspirado alerta, confirmación , cuadro de diálogo de selección popups sin cualquier dependencia.

Funcionamiento

Para empezar, inserte los archivos JavaScript y CSS de duDialog en la página.

<link href="duDialog.css" rel="stylesheet">
<script src="duDialog.js"></script>

Cree un cuadro de diálogo de alerta básico con un botón Aceptar.

new duDialog('Alert Message', 'This is an alert message.');

Cree un diálogo de confirmación con devoluciones de llamada.

new duDialog('Confirm Dialog', 'Are You SUre', duDialog.OK_CANCEL, {


 okText: 'Confirm',


callbacks: {



okClick: function(){




// do something



},



cancelClick: function(){




// do something



}


}
});

new duDialog('Select An Item', ['CSS', 'SCRIPT', 'COM'], {

selection: true,

 callbacks: {


itemSelect: function(e, item){



// this.value


}

}
});

// or
new duDialog('Select An Item',


 [{ name: 'CSS', id: 1 }, { name: 'SCRIPT', id: 2 }, { name: 'COM', id: 3 }],


 {


selection: true,


textField: 'name',


valueField: 'id',


callbacks: {



itemSelect: function(e, i){




// this.value



}


}
});

Todas las configuraciones opcionales con valores predeterminados.

okText: 'Ok',
 cancelText: 'Cancel',
selection: false, // enables item selection
multiple: false, // enables multiple selection
selectedValue: null, // preselected values
valueField: 'value', // field name
textField: 'item',
// field name
callbacks: null // callbacks

Registro de cambios

01/10/2019

• Las mejoras menores

01/09/2019

• Las mejoras menores
• Errores

12/07/2018

• Pequeñas correcciones

11/28/2018

• Las actualizaciones menores