@uicapivara/cp-select
Version:
cp-select
65 lines (54 loc) • 1.5 kB
HTML
<html lang="pt">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible"
content="ie=edge">
<title>Demo in CapivaraJS</title>
<link rel="stylesheet"
href="../dist/cp-select.css" />
<style>
body,
html {
width: 100%;
height: 120%;
background: #f5f5f5;
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<div style="width: 257px;">
<cp-select cp-model="$ctrl.venda.cliente"
items="$ctrl.pessoas"
field="'name'"
on-select="$ctrl.afterSelect"
debounce="1">
</cp-select>
</div>
<script src="../dist/cp-select.js"></script>
<script>
class MyController {
constructor() {
this.venda = {
cliente: { name: "Caio" }
}
this.pessoas = [
{ name: "Mateus" },
{ name: "Caio" },
{ name: "Felipe" },
{ name: "Douglas" },
]
}
afterSelect(value) {
console.log('Selecionou: ', value);
}
}
capivara.controller(document.body, MyController);
</script>
</body>
</html>