如何在变量中插入动态多行文本框生成的值

时间:2017-12-21 08:17:15

标签: javascript c# jquery json ajax

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

$('#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代码

<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方法将其发送到服务器端但不知道如何实现它我在上面的代码中仅显示了特定的输入框

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

如何为多个动态生成的输入文本框实现它。 服务器端的代码我只是展示了一些项目我是怎么做的。

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();
            }
        }
    }

1 个答案:

答案 0 :(得分:1)

尝试这样做,使用.serializeArray()find()

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

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