獲取DIV中的所有內容，包括輸入選擇器的標記值

我正在加載容器div內的html表單。這個html是一個從數據庫中檢索的模板。然後使用填寫表單（或表單的一部分）。獲取DIV中的所有內容，包括輸入選擇器的標記值

一旦用戶完成，他們選擇一個調用函數的按鈕。

function submitForm() { 
    var workflowID = $('#workFlowID').val(); 
    var formID = $('#formID').val(); 
    var uploadedFiles = $('#uploadedFiles').val(); 
    var htm = $('#formContent').html(); 
    console.log(htm); 
    alert(workflowID + ", " + formID + ", " + uploadedFiles + ", : " + htm); 
}

的問題是，我得到忠實地再現的形式，但輸入字段不包含在最終的「HTM」我需要能夠重現HTML，因爲它已經被充填到保存到新表。我錯過了什麼，或者甚至有可能？

已被要求提供更多信息;這裏是一個例子，html可能有10個輸入區域。一旦適當的輸入被填寫，表格被保存以供其他人查看並在那裏添加。當填寫表格時，上面的參考代碼會將html減去用戶輸入的值。

來源

2012-08-01 Russell Walters

請幫助我們瞭解更多信息.... – Wazzzy 2012-08-01 17:00:42

如果表單來自db，爲什麼不保存模板的pk和選定的值？您可以從這些信息重新創建它，而無需重複數據庫中已有的內容。 – bdares 2012-08-01 17:04:22

這些表格很簡單，但最多有70個輸入字段。我原本打算走這條路，可能還需要。但表格可能會多次使用，然後數據場會在一年內看到100萬行的潛力，而表單本身通常小於16k。存儲將是最小的，找到表單會更快，找到表單排序通過百萬記錄然後填充表單。雖然通過將表單存儲在僅處理該表單請求的特定表中，存儲空間會稍微多一點。 – 2012-08-01 17:12:53

我發現答案的概念是通過每個標籤並設置屬性。

$("input").each(function() { 
    if ($(this).is(':text')) { $(this).attr("value", $(this).val()); } 
    else if ($(this).is(':checkbox')) { 
     if ($(this).is(':checked')) { 
      $(this).attr('checked', 'checked'); 
     } 
     else { 
      $(this).removeAttr('checked'); 

     } 
     if ($(this).is("textarea")) { 
       $(this).text($(this).val()); 
     } 
     if ($(this).is(':radio')) { 
      if ($(this).is(':checked')) { 
       $(this).attr('checked', 'checked'); 
      } 
      else { 
       $(this).removeAttr('checked'); 

      } 

     }

那麼我可以回去做什麼，我試圖做開始：

var htm = $('#formContent').html();

這將包括在HTML中輸入的值。

感謝所有迴應並幫助我指出了正確的方向。

來源

2012-08-02 18:21:46

我不確定如何評論您的文章與其他人一樣，但是您使用服務器端來使用哪種語言來促進此操作？它是C＃，PHP或...

編輯：

我想我以前也有過類似的問題。我所做的是對整個頁面（所有html元素和所有內容）的AJAX請求。你會將這些數據返回到一個變量中。你必須通過這個變量來解析你正在尋找的信息。例如，如果你想要一切之間的一切，你可以做一些字符串解析來獲得單獨的。

我不是說這是一件好事，但它可能是一個可行的解決方案，如果我理解正確。

您可能也可以嘗試 http://api.jquery.com/html/ 並將其用於您的窗體或身體的ID。

來源

2012-08-01 17:21:02 Steve

後端是C＃WEb方法，前端是jQuery，問題是我想簡單地用輸入值獲取html。保存，存儲一切都很簡單。問題是獲取輸入值不變的html。 – 2012-08-01 17:28:57

因此，您在名爲「formContent」的表單元素中有一個div，並且您想提取該div內所有輸入的值（可能爲html），但輸入的數量在提交時未知？他們都是textareas嗎？

嘗試使用jQuery來查找所有適當的區域，但我不確定如何處理這些值。

var value = ""; 
$("#formContent").children("textarea").each(function(){value += $(this).val()});

編輯：OP的討論後，添加更多

所以，我想補充一個數據庫表中至少有兩列：ElementID和價值。製作一個web服務來檢查是否存在ElementID。如果存在，則更新值，否則插入。

使用這些數據來填充表單的值。這可能是服務器端的一個挑戰，您可能不得不依靠客戶端上的多個調用來獲取和填充。

最後，在用戶點擊提交後，使用我上面顯示的類似方法來查找所有輸入並執行對web服務的ajax調用，提交元素的id和它的值。類似這樣的：

$("#formContent").find("input", "select", "textarea").each(
    function() 
    { 
     var elementId = $(this).attr("id"); 
     var value = $(this).val(); 
     //perform ajax call to webservice with elementId and value parameters 
    } 
);

請記住，每個elementId都需要是唯一的，這可能會導致多個HTTP請求。否則，您可能希望一次發送一些可解析的數據直到所有數據的web服務並相應地更新。

來源

2012-08-01 17:26:34 AceCorban

我其實想要輸入完整的html。他們可以是輸入，收音機，複選框textareas。如果我必須返回並提取這些值並將它們存儲在一個單獨的表中，那麼這就是我必須做的。希望是保存完整的html值。 – 2012-08-01 17:32:48

在這種情況下，我不確定你能做到這一點。不知何故，你在動態地構建表單輸入（這是在服務器端還是客戶端完成的）？您可以使用formContent選擇器的.html（）屬性獲取表單生成的div的html，但它們不會將「value」屬性應用於它們，這些屬性保留在DOM中，而不是標記。 – AceCorban 2012-08-01 17:39:23

表單存儲在數據庫表中並讀入我正在使用的DIV中。 – 2012-08-01 17:44:22

獲取DIV中的所有內容，包括輸入選擇器的標記值

回答

相關問題