簡體   English   中英

在重新加載頁面上,我丟失了使用用戶輸入創建的劍道網​​格數據

[英]On reload page I am losing the kendo grid data which I am creating using user-input

這是我的 HTML 文件——一個簡單的表單,帶有創建用戶的創建按鈕

<html>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/jquery.min.js"></script>
<base href="https://demos.telerik.com/kendo-ui/dialog/predefined-dialogs">
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script>
<script src="aza.js"></script>
<link href="kendo.html">
<link href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.default.min.css" rel="stylesheet" />

<h3> ADD USER</h3>
<dl>
    <dt>FirstName</dt>
    <dd>
        <input type="text" id="inputtext3">
    </dd>
    <dt>LastName</dt>
    <dd>
        <input type="text" id="inputtext4">
    </dd>
    <dt>Age</dt>
    <dd>
        <input type="text" id="inputtext5">
    </dd>
    <dd>
        <button id="add"> Create </button>
    </dd>
</dl>
<div id="grid">
    <table id="weapons">
        <tr>
            <th data-field="firstname">FirstName</th>

            <th data-field="lastname">LastName</th>

            <th data-field="age">Age</td>

        </tr>

    </table>
</div>

</html>

這是我的 JS --在創建按鈕上將數據綁定到 KENDO GRID 但問題是在重新加載頁面時丟失數據

  app.controller('aza', function() {
     $(function() {

        var Weapon = kendo.data.Model.define({

        id: "firstname"

        })
        dataSource = new kendo.data.DataSource({
        transport: {
         read: {
            dataType: "json"
         } ,
         create : {
            dataType: "json",type: "POST"
         } 

        },

        pageable: {
            refresh : true
        },
        schema : {
            model : Weapon}

        });
        $("#weapons").kendoGrid({

            dataSource : dataSource
        });

         $("#add").click(function(){
            dataSource.add({  firstname : $("#inputtext3").val(),lastname: $("#inputtext4").val(),age: $("#inputtext5").val() });
            dataSource.sync();
            $("#inputtext3").val('');
            $("#inputtext4").val('');
            $("#inputtext5").val('');
            $('#weapons').data('kendoGrid').dataSource.read(); 

    $('#weapons').data('kendoGrid').refresh(); 

        })
        });

    });

我想在重新加載頁面時保留輸入數據,第二件事如何僅在其他 html 頁面中顯示相同的數據

要在頁面重新加載之間保留數據,您可以使用localStoragesessionStorage
兩者使用相同的API,區別在於sessionStorage對象只存儲一個會話的數據(關閉瀏覽器選項卡時數據被刪除), localStorage對象存儲的數據沒有過期日期。

例子

// Store value
localStorage.setItem("inputtext3", $("#inputtext3").val(''));
// Retrieve value
$("#inputtext3").val(localStorage.getItem("inputtext3"))

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM