Files
jube-fork/Jube.App/wwwroot/kendo/examples/textarea/api.html
2022-11-04 13:24:24 +02:00

112 lines
3.1 KiB
HTML
Executable File

<!DOCTYPE html>
<html>
<head>
<title>API</title>
<meta charset="utf-8">
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
<link href="../../styles/kendo.common.min.css" rel="stylesheet">
<link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">
<script src="../../js/jquery.min.js"></script>
<script src="../../js/jszip.min.js"></script>
<script src="../../js/kendo.all.min.js"></script>
<script src="../content/shared/js/console.js"></script>
<script>
</script>
</head>
<body>
<a class="offline-button" href="../index.html">Back</a>
<div id="example">
<div class="configurator">
<div class="header">Configurator</div>
<div class="box-col">
<h4>Get / Set Value</h4>
<ul class="options">
<li>
<button id="get">Get value</button> or <button id="focus">Focus</button>
</li>
<li>
<input id="value" value="Lorem ipsum dolor sit amet" />
<button id="set">Set value</button>
</li>
</ul>
</div>
<div class="box-col">
<h4>Enable / Disable</h4>
<ul class="options">
<li>
<button id="enable">Enable</button>
<button id="disable">Disable</button>
</li>
<li>
<button id="readonly">Readonly</button>
</li>
</ul>
</div>
</div>
<div class="demo-section k-content">
<h4>Set value</h4>
<textarea id="description" style="width:100%"></textarea>
</div>
<script>
$(document).ready(function () {
var textarea = $("#description").kendoTextArea({
label: {
content: "Description",
floating: true
},
rows: 5
}).data('kendoTextArea');
var setValue = function () {
textarea.value($("#value").data("kendoTextBox").value());
textarea.floatingLabel.refresh();
};
$("#enable").click(function () {
textarea.enable();
});
$("#disable").click(function () {
textarea.enable(false);
});
$("#readonly").click(function () {
textarea.readonly();
});
$("#focus").click(function () {
textarea.focus();
});
$("#value").kendoTextBox({
change: setValue
});
$("#set").click(setValue);
$("#get").click(function () {
alert(textarea.value());
});
});
</script>
<style>
.k-floating-label-container {
width: 100%;
}
</style>
</div>
</body>
</html>