function progressBar($name) { $pb = new \Kendo\UI\ProgressBar($name); $animation = new \Kendo\UI\ProgressBarAnimation(); $animation->duration(600); $pb->type('percent')->animation($animation); return $pb; }
?> <div id="example" class="k-content"> <div class="demo-section"> <h2>Reset Password</h2> <div> <ul class="forms"> <li> <label>New Password</label> <input id="userPass" type="password" name="userPass" value="" class="k-textbox" style="width: 260px;" /> </li> <li> <label>Password strength</label> <?php $pb = new \Kendo\UI\ProgressBar('passStrength'); $pb->type('value')->max(9)->animation(false)->change('onChange'); echo $pb->render(); ?> </li> <li> <label></label> <button id ="submitButton" class="k-button">Done</button> </li> </ul> </div> </div> <?php require_once '../include/footer.php'; ?>
<?php require_once '../lib/Kendo/Autoload.php'; require_once '../include/header.php'; ?> <div id="example" class="k-content"> <div class="demo-section"> <h2>Profile Completeness</h2> <div class="completenessLevel"> <h2>40%</h2> <?php $pb = new \Kendo\UI\ProgressBar('profileCompleteness'); $pb->type('chunk')->chunkCount(5)->min(0)->max(5)->value(2); echo $pb->render(); ?> </div> </div> <div class="demo-section"> <h2>Please fill your details</h2> <div> <ul class="forms"> <li> <label>First Name</label> <input type="text" name="firstName" value="" class="k-textbox" style="width: 265px;" /> </li> <li> <label>Last Name</label> <input type="text" name="lastName" value="" class="k-textbox" style="width: 265px;" /> </li>
<?php require_once '../lib/Kendo/Autoload.php'; require_once '../include/header.php'; ?> <div id="example" class="k-content"> <div class="k-rtl demo-section"> <h3 class="title">ProgressBar</h3> <?php $pb = new \Kendo\UI\ProgressBar('progressBar'); $animation = new \Kendo\UI\ProgressBarAnimation(); $animation->duration(600); $pb->type('percent')->animation($animation)->complete('onComplete'); echo $pb->render(); ?> <button id="startProgress" class="k-button">Start progress</button> </div> <?php require_once '../include/footer.php'; ?> <script> $("#startProgress").click(function () { if (!$(this).hasClass("k-state-disabled")) { $(this).addClass("k-state-disabled"); progress(); }
<?php require_once '../lib/Kendo/Autoload.php'; require_once '../include/header.php'; ?> <div id="example" class="k-content"> <div class="demo-section"> <div class="loading"> <?php $pbtotal = new \Kendo\UI\ProgressBar('totalProgressBar'); $pbtotal->type('chunk')->chunkCount(4)->min(0)->max(4)->orientation('vertical')->complete('onTotalComplete'); echo $pbtotal->render(); ?> <?php $pb = new \Kendo\UI\ProgressBar('loadingProgressBar'); $pb->orientation('vertical')->showStatus(false)->animation(false)->change('onChange')->complete('onComplete'); echo $pb->render(); ?> </div> <div class="loadingInfo"> <h2>Loading styles</h2> <div class="statusContainer"> <p> Loaded: <span class="loadingStatus">0%</span> <br /> Item <span class="chunkStatus">1</span> of 4 </p> </div> <button class="k-button reloadButton">Reload</button> </div>
<?php require_once '../lib/Kendo/Autoload.php'; require_once '../include/header.php'; ?> <div id="example" class="k-content"> <div class="demo-section"> <h3 class="title">ProgressBar</h3> <?php $pb = new \Kendo\UI\ProgressBar('progressBar'); $pb->type('percent')->min(0)->max(10)->change('onChange')->complete('onComplete'); echo $pb->render(); ?> <button id="startProgress" class="k-button">Start progress</button> </div> <div class="demo-section"> <h3 class="title">Console log</h3> <div class="console"></div> </div> <?php require_once '../include/footer.php'; ?> <script> function onChange(e) { kendoConsole.log("Change event :: value is " + e.value); } function onComplete(e) {