dans les boutons de la barre d'outils de la grille de la grille UI de Kendo. Je me demande qu'il est possible d'aligner Excel em> et pdf em> uniquement au côté droit du panneau. Et créer em> restera à la gauche. toolbar: ["create", "excel", "pdf"],
3 Réponses :
Vous pouvez utiliser la barre d'outils : kendo.template ($ (modèle # (# modèle »). HTML ()) pour cela. Jetez un coup d'œil à Cette démo pour un exemple.
Vous pouvez accéder à un lien spécifique dans CSS par son index avec : nth-enfant () , voir https://developer.mozilla.org/en-us/docs/web/css/:nth-child
Vous pouvez utiliser CSS pour le faire. Les boutons ont des noms de classe fixe que vous pouvez utiliser.
voir l'extrait pour une démonstration: p>
p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css"/>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>
<style>
.k-grid-toolbar {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.k-grid-toolbar .k-grid-excel {
margin-left: auto;
}
</style>
</head>
<body>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
toolbar: ["create", "excel", "pdf"],
columns: [
{ field: "name" },
{ field: "age" }
],
dataSource: {
data: [
{ id: 1, name: "Jane Doe", age: 30 },
{ id: 2, name: "John Doe", age: 33},
],
schema: {
model: { id: "id" }
}
},
editable: true
});
</script>
</body>
</html>