We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
BoldSignEasily embed eSignatures in your .NET applications. Free sandbox with native SDK available.
|
<template>
<div id="app">
<ejs-grid
. . . .
:actionBegin="actionBegin"
:actionComplete="actionComplete"
:toolbar="toolbar"
height="273px"
>
<e-columns>
<e-column
field="OrderID"
headerText="Order ID"
textAlign="Right"
:isPrimaryKey="true"
width="100"
></e-column>
<e-column field="CustomerID" headerText="Customer ID" width="120"></e-column>
<e-column field="ShipCountry" headerText="Ship Country" width="150"></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
. . . .
export default {
data() {
return {
data: data,
. . . .
template: function() {
return { template: DialogTemplate };
}
},
},
methods: {
actionBegin(args) {
if (args.requestType === "save") {
// cast string to integer value.
args.data["Freight"] = parseFloat(
args.form.querySelector("#Freight").value
);
}
},
actionComplete(args) {
// Set initail Focus
if (args.requestType === "beginEdit") {
args.form.elements.namedItem("CustomerName").focus();
}
}
}
};
</script> |
|
<template>
<div id="dialogTemplate">
<ejs-tab id="element">
<e-tabitems>
<e-tabitem :header="headerText0" content="#general"></e-tabitem>
<e-tabitem :header="headerText1" content="#seo"></e-tabitem>
</e-tabitems>
</ejs-tab>
<div id="general">
. . .
</div>
<div id="seo" style="display: none">
. . . . .
</div>
</div>
</template>
<script>
import Vue from "vue";
import { data } from "./data";
import { DataUtil } from "@syncfusion/ej2-data";
import { TabPlugin } from "@syncfusion/ej2-vue-navigations";
Vue.use(TabPlugin);
export default {
data() {
let shipCity = DataUtil.distinct(data, "ShipCity", true);
let shipCountry = DataUtil.distinct(data, "ShipCity", true);
return {
data: {},
shipCityDistinctData: shipCountry,
shipCountryDistinctData: shipCountry,
headerText0: { text: "Edit/Add" },
headerText1: { text: "JavaScript" }
};
}
</script>
|
