将数据从表单传递到另一个页面上的表-knockout.js

我想知道，是否可以使用不同页面上表单的用户输入来更新一个页面上的表？

注意：在我的项目中，我使用nodejs创建服务器，引导前端和淘汰，jQuery和标准JS在后端。

这是我创建表的代码部分：

<div id="cTable"> 
 <table id="contract_table">
    <thead>
        <tr>
            <td id="td1">Contract Ref.</td>
            <td id="td2">Farm Ref.</td>
            <td id="td3">Type</td>
            <td id="td4">Variety</td>
            <td id="td5">Grade</td>
            <td id="td6">Season</td>
            <td id="td7">Created Date</td>
            <td id="td8">Agreed Date</td>
            <td id="td9">Est. As Grown Qty</td>
            <td id="td10">Committed Qty</td>
            <td id="td11">Optional Qty</td>
            <td id="td12">Moved Qty</td>
            <td id="td13">UOM</td>
        </tr>
    </thead>
     <!-- Array bound to table --> 
    <tbody data-bind="foreach: items">
        <tr>
            <td data-bind="text: contractReference"></td>
            <td data-bind="text: farmReference"></td>
            <td data-bind="text: productType"></td>
            <td data-bind="text: productVariety"></td>  
            <td data-bind="text: grade"></td>
            <td data-bind="text: season"></td> 
            <td data-bind="text: dateCreated"></td>
            <td data-bind="text: dateAgreed"></td>
            <td data-bind="text: asGrown"></td>
            <td data-bind="text: committed"></td>  
            <td data-bind="text: optional"></td>
            <td data-bind="text: moved"></td> 
            <td data-bind="text: uom"></td>            
        </tr>
    </tbody>
</table>   
 </div>     
</div>

这是将用户输入添加到表中的淘汰代码：

// Make each item an observable object
var contractTableViewModel = {
    items: ko.observableArray([]),
    contractReference: ko.observable(),
    farmReference: ko.observable(),
    productType: ko.observable(),
    productVariety: ko.observable(),
    grade: ko.observable(),
    season: ko.observable(),   
    dateCreated: ko.observable(),    
    dateAgreed: ko.observable(),   
    asGrown: ko.observable(),   
    committed: ko.observable(),     
    optional: ko.observable(),     
    moved: ko.observable(),     
    uom: ko.observable(),  

    // Add item to the array
    addItem: function () {
    this.items.push({
        contractReference: this.contractReference(),
        farmReference: this.farmReference(),
        productType: this.productType(),
        productVariety: this.productVariety(),
        grade: this.grade(),
        season: this.season(),
        dateCreated: this.dateCreated(),
        dateAgreed: this.dateAgreed(),
        asGrown: this.asGrown(),
        committed: this.committed(),
        optional: this.optional(),
        moved: this.moved(),
        uom: this.uom()
    });
   }
 }
// Initialised when page loads
ko.applyBindings(contractTableViewModel);

这是我的表格：

<div id="cForm">
<!-- Bind to observables from input boxes on form -->
 <form id="contract_form" action= "/api/contracts/" method="post">
     Contract Reference:
    <input type="text" id="cref" data-bind="value: contractReference">
    <br/><br/>Farm Reference:
    <input type="text" id="fref" data-bind="value: farmReference" onclick="this.value=' ';" />
    <br/><br/>Product Type:
    <input type="text" id="ptype" data-bind="value: productType" onclick="this.value=' ';" />
    <br/><br/>Product Variety:
    <input type="text" id="pvar" data-bind="value: productVariety" onclick="this.value=' ';" />
    <br/><br/>Grade:
    <input type="text" name="grade" data-bind="value: grade" onclick="this.value=' ';" />
    <br/><br/>Season:
    <input type="text" name="season" data-bind="value: season" onclick="this.value=' ';" />
    <br/><br/>Date Created:
    <input type="text" name="dcreated" data-bind="value: dateCreated" onclick="this.value=' ';" />
    <br/><br/>Date Agreed:
    <input type="text" name="dagreed" data-bind="value: dateAgreed" onclick="this.value=' ';" />
     <br/><br/>Estimated As Grown Quantity:
    <input type="text" name="grown" data-bind="value: asGrown" onclick="this.value=' ';" />
     <br/><br/>Committed Quantity:
    <input type="text" name="comm" data-bind="value: committed" onclick="this.value=' ';" />
     <br/><br/>Optional Quantity:
    <input type="text" name="opt" data-bind="value: optional" onclick="this.value=' ';" />
     <br/><br/>Moved Quantity:
    <input type="text" name="moved" data-bind="value: moved" onclick="this.value=' ';" />
     <br/><br/>UOM:
    <input type="text" name="uom" data-bind="value: uom" onclick="this.value=' ';" />

    <br/>
    <br/>
    <input type="button" value="Add new contract" data-bind="click: addItem" onclick="getValues();"/> <!-- Call addItem function -->
     <input type="reset" value="Reset Form">
     <br/> <br/>
</form>
 </div>

因此，基本上，如果我将表单和表放在同一页面上，那么当我单击提交按钮时，我可以将数据添加到表单中，并在表中看到它的更新，但我的目标是让用户在单独的页面上输入数据，然后返回表页面，在表中查看他们的输入。

旁注：我在淘汰代码中也得到了一个错误，说ko没有正确引用。我已经在创建表的页面的头部包含了该脚本，位于包含淘汰文件的脚本之上。我有点困惑，为什么这种情况还在发生？

（希望这是有道理的。如果没有，请要求澄清。还请询问是否需要查看更多代码）