如何在变量中插入动态多行文本框生成的值 [英] how to insert dynamic multiple rows textboxes generated value in a variable

问题描述

我正在尝试在变量中插入动态多行文本框生成的值，以通过ajax json将其发送到服务器端. 用于生成多个动态值的代码.

I'm trying insert dynamic multiple rows textboxes generated value in a variable to send it through ajax json to server side. Code for generating multiple dynamic values.

$('#btnASize').click(function() {
  var sizerangeMin = "<input type='text' ID='SizeMin' value='2.00' />";
  var ToleranceMin = "<input type='text' ID='TolMin'+i value='1' />";
  var ToleranceMax = "<input type='text' ID='TolMax'+i value='1' />";
  var markup = "<tr><td>" + sizerangeMin + "</td><td>" + ToleranceMin + "</td><td>" + ToleranceMax + "</td></tr>";
  $("#WireDimTbl tbody").append(markup);
});

$('#btnASizeR').click(function() {
  var sizerangeMin = "<input type='text' ID='SizeMin' value='2.00' />";
  var sizerangeMax = "<input type='text' ID='SizeMax' value='3.00' />";
  var ToleranceMin = "<input type='text' ID='TolMin' value='1' />";
  var ToleranceMax = "<input type='text' ID='TolMax' value='1' />";
  var markup = "<tr><td>" + sizerangeMin + "</td><td>" + sizerangeMax + "</td><td>" + ToleranceMin + "</td><td>" + ToleranceMax + "</td></tr>";
  $("#WireDimTbl tbody").append(markup);
});

$('#btnWdDelete').click(function() {
  $("#WireDimTbl tbody>tr:last").remove();
})

用于发送数据的Ajax代码

Ajax code for sending data

<script type="text/javascript" src="http://cdn.jsdelivr.net/json2/0.1/json2.js"></script>
<script type="text/javascript">
    $(function() {
        $(document).on("click", "[id*=btnFrmSubmit]", function() {
            var user = {};
            user.PRODUCT_ID = 1;
            user.TDC_NO = $("[id*=Tdc_No]").val();
            $.ajax({
                type: "POST",
                url: "TDC.aspx/SaveFrmDetails",
                data: JSON.stringify({
                    user: user
                })
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(response) {
                    alert("Data has been added successfully.");
                    window.location.reload();
                },
                error: function(response) {
                    alert(response.responseText);
                }
            });
        });
    });
</script>

在上面的ajax方法中，我想在"var user"中存储动态生成的多个文本框的值，以通过ajax方法将其发送到服务器端，但不知道如何实现它，我在上面的代码中仅针对特定的输入框

In the above ajax method i want to store values of dynamically generated multiple textboxes value in "var user" to send it through ajax method to server side but not getting any idea how to achieve it i have shown in above code only for a particular input box

"<th class='text-center'>TDC No.</th>" +
                        "<th><input id='Tdc_No' type='text' value='7y'/></th>". 

如何针对多个动态生成的输入文本框实现此目标. 服务器端的代码，我只显示几个项目，我该怎么办.

how to achieve it for multiple dynamically generated input textboxes. Code at server side i am just showing few items how am i doing.

public class User
{
    public decimal PRODUCT_ID { get; set; }
    public string TDC_NO { get; set; }
    .
    .
}

[WebMethod]    
    public static void SaveFrmDetails(User user)
{
 string connectionString = ConfigurationManager.ConnectionStrings["condb"].ConnectionString;
 using (OracleConnection con = new OracleConnection(connectionString))
        {
            using (OracleCommand cmd = new OracleCommand("INSERT INTO TDC_PRODUCT1(TDC_NO) VALUES (:TDC_NO)",con)
  cmd.CommandType = CommandType.Text;                
  cmd.Parameters.AddWithValue(":TDC_NO", user.TDC_NO);
 cmd.Connection = con;
                con.Open();
                cmd.ExecuteNonQuery();
                con.Close();
            }
        }
    }

推荐答案

像这样尝试，请使用. serializeArray()和 find()

try like this , make use of .serializeArray() and find()

$( "#target" ).click(function() {
  alert(JSON.stringify($("#WireDimTbl tbody").find(":input").serializeArray()));
});

jsfiddle工作: https://jsfiddle.net/pranayamr/odja5te0/

jsfiddle working : https://jsfiddle.net/pranayamr/odja5te0/

这篇关于如何在变量中插入动态多行文本框生成的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！