如何将JSON数据传递到文本框Asp.net Ajax

时间:2018-12-27 05:16:33

标签: asp.net ajax

我正在从edit_retrun.aspx页面检索数据。数据成功返回,我通过alert(data.d);格式检查了一下,以这种方式成功调用了ajax方法

[{"id":"464","fname":"dsf","age":"34"}]

但是当我尝试将数据传递到相关的文本框时,它不会显示结果文本框,也不会显示任何错误。到目前为止我尝试过的内容附在下面。

这些是用于传递数据的文本框。

 $('#fname').val(data.fname);                        
 $('#age').val(data.age);

Ajax完整代码

 $.ajax({
         type: 'POST',
         url: 'edit_return.aspx/doSome',
         dataType: 'JSON',
         data: "{id: '" + id + "'}",
         contentType: "application/json; charset=utf-8",
         success: function (data) {
         alert(data.d);    
         console.log(data.fname);
         $("html, body").animate({ scrollTop: 0 }, "slow");
         isNew = false       
         $('#fname').attr('value', data.fname);
         $('#fname').val(data.fname);                        
         $('#age').val(data.age);

        },

edit_retrun.aspx页面

 [WebMethod]
public List<Employee> doSome(int id)
{
    SqlConnection con = new SqlConnection("server=.; Initial Catalog = jds; Integrated Security= true;");
    string sql = "select * from record where id='" + id + "'";
    SqlCommand cmd = new SqlCommand(sql, con);
    con.Open();
    cmd.ExecuteNonQuery();
    DataTable dt = new DataTable();
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    da.Fill(dt);
    List<Employee> employees = new List<Employee>();

    employees = dt.AsEnumerable()
            .Select(x => new Employee()
            {
                id = x.Field<int>("id").ToString(),
                fname = x.Field<string>("name"),
                age = x.Field<int>("age").ToString(),
            }).ToList();
    return employees;
}

表单设计

<form  id="frmProject" runat="server">
        <div>
            <label class="form-label">First Name</label>     
           <input type="text" id="fname" name="fname" class="form-control"  required />

        </div>
        <div class="form-group" align="left">
         <label class="form-label">Age</label>
            <input type="text" id="age" name="age" class="form-control"  required />
        </div>
        <div> 
           <input type="button" id="b1" value="add" class="form-control" onclick="addProject()" />

        </div>      
    </form>

enter image description here

2 个答案:

答案 0 :(得分:1)

正如您在alert(data.d)时所说的那样:

[{"id":"464","fname":"dsf","age":"34"}]

使用此:

$('#fname').attr('value', data.d[0].fname);

工作演示:

var d= [{"id":"464","fname":"dsf","age":"34"}]

$('#fname').attr('value', d[0].fname);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="fname">

答案 1 :(得分:1)

JSON.parse(data);

然后分配给文本框。

引用this链接。