码迷,mamicode.com
首页 > Web开发 > 详细

Ajax和Json实现后台传集合给前台并赋值文本框-----Ajax\Json\JQuery

时间:2015-04-10 19:23:11      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:

功能:放两个文本框和一个确定按钮,确定按钮绑定点击事件,点击确定就加载后台数据库中的数据,显示在文本框中。

基础知识:JQuery  ajax异步 .eval() .each() json数据

 1、HTML文件

<div id="Text">

 <input type="text" id="comment1" name="t_A21" numberID="one" value="" />

 <input type="text" id="comment2"name="t_A22" numberID="one" value="" />

 <input type="button" class ="button1"  onclick="showSendDialog(‘divOutPutSelcet‘)" >确定</intput>

 <input type="text" id="hidcomment" value="321" />

</div>

 

2、JS文件

function(obj){

$.ajax({

url:"相对路径/xxx.ashx",

global:false,

dataType:"json",

data:{"FunctionType":"Comment","PrimaryKey":$("#hidcomment").val()},//给后台用的参数 success里面不能用

success:function(data){

var result = eval(data.Data);

var numberId = "one"

 var inputList = $("#Text").find("input[numberID=‘" + numberID+ "‘]");  //理论上id不能重复 如果重复可以用 $("#Text #txtComment")定位

 $(inputList).each(function(){

  for (var i = 0; i < result.length; i++) {

    var tempCode = $(this).attr("name").substring(2,5);
    if (result[i].LineCode == tempCode) {//result[i].LineCode后台数据库LineCode字段与前台文本框name值2-5位相一致
        $(this).val(result[i].ItemValue)//数据库中字段ItemValue
      }

});    /另一种写法*$("#Text").find("input[numberID=‘" + numberID+ "‘]").each(function () {}*/

},

error:function(str){

  alert(str.Message);

} });
}

3、后台xxx.ashx

 

public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";
        string FunctionType = context.Request["FunctionType"].ToString();
        switch (FunctionType)
        {
            case "Comment":
                HttpContext.Current.Response.Write(GetComment());
                break;
         }
    }

  public string GetComment()
    {
        try
        {
            string primaryKey= HttpContext.Current.Request["PrimaryKey"];

            EnterpriseCommentBLL ecBll = new EnterpriseCommentBLL();//业务逻辑层
            EnterpriseCommentModel ecModel = efcBll.GetModel(orderId);//Model类库

            return new PageMessageEx(true, "成功传递信息", efcModel).ToString();//放在App_Code中的PageMessageEx.cs文件封装了一个方法,.ToString()是封装好的转换为Json数据的属性
        }
        catch (Exception ex)
        {
            return new PageMessage(false,ex.Message).ToString();//放在App_Code中的PageMessage.cs文件封装了一个方法,.ToString()是封装好的转换为Json数据的属性
        }
    }

4、PageMessage.cs 和PassageMessageEx.cs(放在App_Code)

(1)PageMessage

using System;
using Newtonsoft.Json;

/// <summary>
/// 为服务器端给页面的ajax调用的返回信息提供数据载体
/// </summary>
public class PageMessage
{
    public PageMessage()
    {
    }

    /// <summary>
    /// 构造一个返回信息对象,并指定操作结果和提示信息
    /// </summary>
    /// <param name="result">操作结果</param>
    /// <param name="message">提示信息</param>
    public PageMessage(bool result, string message)
    {
        this._result = result;
        this._message = message;
    }

    /// <summary>
    /// 结果
    /// </summary>
    private bool _result;
    /// <summary>
    /// 结果信息描述
    /// </summary>
    private string _message;
    
    /// <summary>
    /// 获取或设置错误结果
    /// </summary>
    public bool Result
    {
        get
        {
            return _result;
        }
        set
        {
            this._result = value;
        }
    }

    /// <summary>
    /// 获取或设置结果信息描述
    /// </summary>
    public string Message
    {
        get
        {
            return _message.Replace("\r\n", String.Empty);
        }
        set
        {
            this._message = value;
        }
    }
    
    /// <summary>
    /// 返回信息的Json表现形式
    /// </summary>
    /// <returns>Json表现形式</returns>
    public override string ToString()
    {
        return JsonConvert.SerializeObject(this);
    }
}

(2)PageMessageEx (继承PageMessage)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;

/// <summary>
///PageMessageEx 的摘要说明
/// </summary>
public class PageMessageEx : PageMessage
{
    public PageMessageEx()
    {
        //
        //TODO: 在此处添加构造函数逻辑
        //
    }
    public PageMessageEx(bool result, string message, object data)
    {
        this.Result = result;
        this.Message = message;
        this.Data = data;
    }

    /// <summary>
    /// 数据
    /// </summary>
    private object _data;
    /// <summary>
    /// 获取或设置数据
    /// </summary>
    public object Data
    {
        get { return _data; }
        set { _data = value; }
    }

    public override string ToString()
    {
        return JsonConvert.SerializeObject(this);
    }
}

 

Ajax和Json实现后台传集合给前台并赋值文本框-----Ajax\Json\JQuery

标签:

原文地址:http://www.cnblogs.com/KrystalNa/p/4415068.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!