檢測已更改的輸入HTML輸入表的值

我試圖找出如何檢測以下預填入輸入表中的已更改的值。我從我的MongoDB獲取數據，並使用Express-Handlebars和nodejs將數據填充到HTML中。檢測已更改的輸入HTML輸入表的值

<form action="/someaction" method="post"> 
    <table class="responsive-table-input-matrix"> 
    <thead> 
     <tr> 
     <th>name</th> 
     <th>some setting</th> 
     <th>some setting</th> 
     <th>some setting</th> 
     <th>some setting</th> 
     </tr> 
    </thead> 
    {{# each values }} 
     <tbody> 
      <tr> 
       <td> {{ this.name}} </td> 
       <td><input type="string" style="position: relative;" name="some setting" value={{this.some setting}} autofocus></td> 
       <td><input type="string" style="position: relative;" name="some setting" value={{ this.some setting}}></td> 
       <td><input type="text" style="position: relative;" value="some setting" value={{ this.some setting}}></td> 
       <td><input type="text" style="position: relative;" value="some setting" value={{ this.some setting}}></td> 
       <input type="hidden" name="someid" value={{ this.some id}}> 
      </tr> 
     </tbody> 
    {{/each}} 
    </table> 
      <button type="submit" class="btn btn-success">Submit</button> 
</form>

當我點擊提交按鈕時，服務器將接收一個包含所有配置的對象。然後我要寫回MongoDB。但是我不想將不變的值寫回它。我可以遍歷該對象，但由於行基本上是無限的，可能導致服務器性能問題。

我想知道是否有可以檢測到該特定行中的值是否已更改，並以某種方式將其標記在我的服務器收到的對象中。這將允許我只在整個對象上迭代一次，並只寫出那些已更改的配置。

我看到在HTML或JS中有某種onChanged事情可以做到這一點。但我只看到它用於直接更改，我只想在按下按鈕時應用更改。

如果可能，我想避免使用Javascript壽！

我希望我能以某種方式表達我想達到的目標。在此先感謝！

來源

2017-08-29 Seitrox

有點遺憾，但HTML不知道字符串類型的輸入。應該是文字的類型。 – Teemu

您將無法避免使用JavaScript。您也需要保留舊值並比較值是否已更改。 –

應該補充說，我不知道多關於HTML。我有服務器和我的mongodb，我試着爲它做一個前端。它在我最初的測試中起作用！但我會改變那個THX！ – Seitrox

您可以用data-屬性標記每一行並用它來檢查它是否發生變化。

例如，在給定的行：

<tr id="tr1" data-foo-bar="original"> 
    <td><input type="text" onchange="change();"></td> 
</tr>

在此行中的值被改變了你觸發此功能：

if (document.getElementById("tr1").dataset.fooBar == "original"){ 
    // hasn't been changed 

} 
else 
{ 
    // it has changed 

}

：

function change(){ 
    document.getElementById("tr1").dataset.fooBar = "modified"; 
}

然後，您可以通過訪問這個屬性

來源

2017-08-29 15:20:18 Lanrex

我現在做了類似的事情。我使用get元素id來更改我添加到表中的隱藏輸入的值。不幸的是，它總是隻改變輸出對象索引0的值。即使我在第三排左右改變了一些東西。另外我需要能夠在我的nodejs服務器代碼中訪問HTML外部的數據標記。沒有像你提出的那樣工作。你知道我能如何解決我的問題嗎？ – Seitrox

我提出這個答案，希望它會有用。對不起，我擔心我不知道可以幫到你。 – Lanrex

它確實幫了大忙！我設法給了id與他們的行對應的一個dinamic numbe。然後我用所說的索引來呼叫js！而繁榮，我想要在那裏。 – Seitrox

檢測已更改的輸入HTML輸入表的值

回答

相關問題