.Net/C#(4)——Ajax至后台获取值并返回前台的问题解决(select控件不用runat=server,通过Ajax获取值)

(不涉及数据库,举例说说我之前犯得错)

一:

先提供Demo代码(Ajax能正常返回值,若有问题,请及时交流,谢谢~):

ZFQKDT.aspx: 【其实跟select控件没关系,因为只是测试Ajax能不能正常返回data】

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ZFQKDT.aspx.cs" Inherits="YJ_ZFQKDT" %>

<%@ Register Assembly="Microsoft.ReportViewer.WebForms, Version=12.0.0.0, Culture=neutral, PublicKeyToken=89845dcd8080cc91" Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style type="text/css">
 .select2 {           
            margin-left: -15px;
            min-width: 273px;
            width: 100px;
        }
</style>
<body style="background: #fff;">
    <form id="form1" class="form-horizontal" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div class="page-body">
            <div class="row">
                <div class="col-lg-12 col-sm-12 col-xs-12">
                    <div class="widget">
                        <div class="widget-header bordered-bottom bordered-gold">
                            <span class="widget-caption">查询条件</span>
                            <div class="widget-buttons">
                                <a href="#" data-toggle="collapse">
                                    <i class="fa fa-minus"></i>
                                </a>
                                <a href="#" data-toggle="dispose">
                                    <i class="fa fa-times"></i>
                                </a>
                            </div>
                        </div>
                        <div class="widget-body bordered-left">
                           <div class="row">
                                <div class="col-lg-5 col-md-5 col-sm-12">
                                    <div class="form-group">
                                        <label for="ddlWFLX" class="col-lg-3 col-md-3 col-sm-2 control-label">违法类型</label>
                                        <div class="col-lg-9 col-md-9 col-sm-10">
                                            <div class="col-sm-8">
                                                <select id="ddlWFLX" class ="select2" name="ddlWFLX" multiple="multiple"></select>
                                                <%--<asp:DropDownList ID="ddlWFLX" CssClass="form-control selectpicker" multiple="multiple"
                                                    data-live-search="true" runat="server" data-width="100%" data-size="5" AutoPostBack="false" OnTextChanged="ddlWFLX_TextChanged" />--%>
                                            </div>
                                        </div>
                                    </div>
                                  <div class="col-lg-2 col-md-2 col-sm-12">
                                    <div class="buttons-preview" style="text-align: center">
                                        <button id="btn_search" type="button" class="btn btn-primary" onclick="search('btnSearch')">
                                            &nbsp; <i class="fa fa-search fa-lg"></i>搜索&nbsp;
                                        </button>
                                        <button id="btn_export" type="button" class="btn btn-primary" onclick="search('btnExport')">
                                            <i class="glyphicon glyphicon-save"></i>导出&nbsp;
                                        </button>
                                    </div>
                                </div>
                                </div>
                           </div>
                        </div>
                    </div>
                </div>
            </div>
          </div>
<asp:Button ID="btnSearch" OnClick="btnSearch_Click" OnClientClick="return search();" runat="server" />
        <asp:Button ID="btnExport" OnClick="btnExport_Click" OnClientClick="return search();" runat="server" />
    </form>
<!--Basic Scripts-->
    <script src="/OperManagent/assets/js/jquery-1.9.1.js"></script>
    <script src="/OperManagent/assets/js/bootstrap.min.js"></script>
    <script>
    $(function () {
            
            BindSelect();

        });
      //绑定字典内容到指定的Select控件
        function BindSelect() {
            $.ajax({
                type: 'get',
                dataType: "json",
                url: "Ajax.aspx",
                data: {},
                async: true,
                success: function (data) {
                    alert(1);
                    var data1 = data;    
                    
                },
                error: function (e) {
                    alert(2);
                    var ex = e;
                }
            });
        }

ZFQKDT.aspx.cs类名与ZFQKDT.aspx页面的@page标签的Inherits属性值一样:(YJ_ZFQKDT )

using EPReport.BLL;
using EPReport.Core;
using EPReport.Entity;
using Microsoft.Reporting.WebForms;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class YJ_ZFQKDT : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
}

Ajax.aspx:(可以只有这一行)【Inherits的值其实可以自定义,反正Ajax.aspx.cs的类名要对的上,否则报错(说不存在对应类)】

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Ajax.aspx.cs" Inherits="Ajax" %>

Ajax.aspx.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;
using EPReport.Core;

public partial class Ajax : System.Web.UI.Page
{
    
    protected void Page_Load(object sender, EventArgs e)
    {
        TestModel model = new TestModel();
        model.name = "xv";
        model.age = 1;

        string json = QueryJson.Serializable<TestModel>(model);
        Response.Write(json);
    }

    class TestModel
    {
        public string name { get; set; }
        public int age { get; set; }
    }
}

QueryJson:

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace EPReport.Core
{
    public class QueryJson
    {
        /// <summary>
        /// 序例化查询数据
        /// </summary>
        /// <param name="data"></param>
        /// <returns></returns>
        public static String DictSerializable(Dictionary<String, String> data)
        {
            if (null == data)
                return string.Empty;
            return JsonConvert.SerializeObject(data);
        }

        /// <summary>
        /// 序列化数据(泛型)
        /// </summary>
        /// <typeparam name="T">类型</typeparam>
        /// <param name="data">数据</param>
        /// <returns></returns>
        public static String Serializable<T>(T data) where T : class
        {
            if (null == data)
                return string.Empty;
            return JsonConvert.SerializeObject(data);
        }

        /// <summary>
        /// 反序列化查询数据
        /// </summary>
        /// <param name="json">需要转换的字符串</param>
        /// <returns></returns>
        public static Dictionary<String, String> DictDeserialize(String json)
        {
            if (String.IsNullOrEmpty(json) || String.IsNullOrEmpty(json.Trim()))
                return null;
            try
            {
                return JsonConvert.DeserializeObject<Dictionary<String, String>>(json);
            }
            catch (Exception ex)
            {
                Generals.Logs(ex.Message);
                return null;
            }
        }

        /// <summary>
        /// 反序列化查询数据(泛型)
        /// </summary>
        /// <typeparam name="T">类型</typeparam>
        /// <param name="json"></param>
        /// <returns></returns>
        public static T Deserialize<T>(String json) where T : class
        {
            if (String.IsNullOrEmpty(json))
                return null;
            return JsonConvert.DeserializeObject<T>(json);
        }

       
    }
}

然后,VS2015中开始调试模式,我选择在谷歌上调试,点击按钮之后,检查并加载之后,谷歌窗口弹出,

我按“F12”,打开谷歌的调试工具,我在JS中设了两个断点:

正常运行,回调函数成功返回data!!!

二:

我现在说说我的问题:

Ajax.aspx.cs文件的Page_Load()里我直接传String对象:

ajax中我使用"type:post",不加data属性,其他没变:

很明显,报错了!!但是String对象值获取到了并返回了,但为什么返回error的回调函数而不是success的???

我查看了Ajax.aspx,response发现没有问题,String值能够返回得到页面:

我将dataType:json改为“:text”,调试一下,返回至“Success的回调函数了”!!

这对比,很明显:返回的值没有转成json类型,ajax接收了但放不了success回调函数里!!

所以:

 string(我将String改成string了,要符合规范嘛~)变量str无论字符串是什么,只有转了json类型,给response返回前台,就能返回到success的回调函数:【ajax的type可以是get也可以post,因为对于这个Demo,没有关系、没有区别】

小疑惑:String与string

 

C#String与string大小写的区别【若使用c#,建议使用string,比较符合规范】

C#中为啥会有大小写两种类型,比如string和String【小写的是基元类型(编译器直接支持的数据类型,比如C#编译器),而大写的是FCL(Framework Class Library)中定义的类型(FCL是.NET Framework通用的)。每种基元类型都会直接映射到FCL中存在的类型】(string数据类型是深蓝色的,与int同色,而String类似石板蓝色的“#CCFFFF”色儿,反正没报错,说明可以使用String类做变量的类型——对象,其弹出提示“可以简化名称”,说明建议规范些,用string做变量的数据类型——变量)

Or

c# 大写字母开头的String和小写字母开头的string的区别【使用反射时,Type.GetType("System.string")一直为null,而Type.GetType("System.String")得出"System.String"。。。其实从我上面那两张图,看得出,string与String都是System.String类】

C#中string类型的常用方法总结【引用String的多个静态方法赋值于string变量】《Or C#字符串的常用操作【还举例使用“StringBuilder、正则表达式”得到的结果如何】》

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章