我遵循了 Ajax 调用方法和 asp.net web 方法。

我的 asp.net 函数正在返回一些我需要在 Ajax 调用中返回的值。

我已经尝试了很多东西,但还没有成功。

这是我的函数,我需要将列表转换为 JSON:

public List < Node > ReadData() {
  SqlConnection conn = new SqlConnection("Data Source=OUMAIMA-PC\\SQLEXPRESS;Initial Catalog=AGIRH;Integrated Security=True");
  string query = "SELECT uo,uo_rattachement,lib_reduit FROM UNITE_ORG ";
  List < Node > list = new List < Node > ();

  SqlCommand cmd = new SqlCommand(query, conn);
  conn.Open();
  SqlDataReader dataReader = cmd.ExecuteReader();
  while (dataReader.Read()) {
    list.Add(new Node {
      uo = dataReader.GetString(0),
        uo_rattachement = dataReader.GetString(1),
        lib_reduit = dataReader.GetString(2)
    });
  }
  dataReader.Close();
  conn.Close();

  return list;

}

**Jquery:**

  $(function() {

      $.ajax({
          type: "POST",
          url: 'WebForm1.aspx.cs/ReadData',
          dataType: "json",
          contentType: "application/json; charset=utf-8",
          success: function(response) {
            if (response != null && response.d != null) {
              var data = response.d;
              alert(typeof(data));
              data = $.parseJSON(data);
              alert(data.subject);
              alert(data.description);
            }
          }
        }; $.ajax(options);
      });
  });

这是我的源代码,我使用 webforms 应用程序和 orgchart.js liberary 这个 aspx.cs 源代码:

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using System.Web.Script.Serialization;
using System.Web.UI;
using System.Web.UI.WebControls;


namespace testProjet
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        private object JsonConvert;

        protected void Page_Load(object sender, EventArgs e)
        {

            if (!IsPostBack)
            {
                if (Session["Nodes"] == null)
                {

                    var jsonSerialization = new System.Web.Script.Serialization.JavaScriptSerializer();

                    List<Node> list = new List<Node>();
                     list.Add(new Node
                     {
                         uo = "1",
                         lib_reduit = "Name 1"
                     });



                    Session["Nodes"] = jsonSerialization.Serialize(list);

        }
            }
        }

        public static List<Node> ReadData()
        {
            SqlConnection conn = new SqlConnection("Data Source=OUMAIMA-PC\\SQLEXPRESS;Initial Catalog=AGIRH;Integrated Security=True");
            string query = "SELECT uo,uo_rattachement,lib_reduit FROM UNITE_ORG ";
            List<Node> list = new List<Node>();

                SqlCommand cmd = new SqlCommand(query, conn);
                conn.Open();
                SqlDataReader dataReader = cmd.ExecuteReader();
                while (dataReader.Read())
                {
                    list.Add(new Node
                    {
                        uo = dataReader.GetString(0),
                        uo_rattachement = dataReader.GetString(1),
                        lib_reduit = dataReader.GetString(2)
                    });
                }
                dataReader.Close();
                conn.Close();

            return list;

        }
        public static void Add(string uo, string uo_rattachement, string lib_reduit)
        {
            var jsonSerialization = new System.Web.Script.Serialization.JavaScriptSerializer();
            var list = jsonSerialization.Deserialize<List<Node>>((string)HttpContext.Current.Session["Nodes"]);
            list.Add(new Node
            {
                uo = uo,
                uo_rattachement = uo_rattachement,
                lib_reduit = lib_reduit
            });
            HttpContext.Current.Session["Nodes"] = jsonSerialization.Serialize(list);
        }

        public static void Remove(string uo)
        {
            var jsonSerialization = new System.Web.Script.Serialization.JavaScriptSerializer();
            var list = jsonSerialization.Deserialize<List<Node>>((string)HttpContext.Current.Session["Nodes"]);
            Node removeItem = null;
            foreach (var item in list)
            {
                if (item.uo == uo)
                {
                    removeItem = item;
                    break;
                }
            }
            list.Remove(removeItem);
            HttpContext.Current.Session["Nodes"] = jsonSerialization.Serialize(list);
        }

        public static void Update(Node oldNode, Node newNode)
        {
            var jsonSerialization = new System.Web.Script.Serialization.JavaScriptSerializer();
            var list = jsonSerialization.Deserialize<List<Node>>((string)HttpContext.Current.Session["Nodes"]);
            foreach (var item in list)
            {
                if (item.uo == newNode.uo)
                {
                    item.uo_rattachement = newNode.uo_rattachement;
                    item.lib_reduit = newNode.lib_reduit;
                    break;
                }
            }
            HttpContext.Current.Session["Nodes"] = jsonSerialization.Serialize(list);
        }


    }
}

这是我的 aspc 代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="testProjet.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta name="viewport" content="width=device-width" />
    <title> OrgChart</title>
    <script src="OrgChart.js"></script>
     <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
     <style>
        html, body {
            width: 100%;
            height: 100%;
            padding: 0;
            margin: 0;
            overflow: hidden;
        }

        #tree {
            width: 100%;
            height: 100%;
        }

        .field_0 {
            font-family: Impact;
        }


    </style>


</head>
<body>



        <form id="form1" runat="server">
            <asp:ScriptManager ID="scm" runat="server" EnablePageMethods="true" />
            <div id="tree">
            </div>
            </form>

            <script >
                var chart = new OrgChart(document.getElementById("tree"), {
                    nodeBinding: {
                        field_0: "UO",
                        field_1:"Uo_Rattachement"
                    },
                    menu: {
                        pdf: { text: "Export PDF" },
                        png: { text: "Export PNG" },
                        svg: { text: "Export SVG" },
                        csv: { text: "Export CSV" }
                    },
                    nodeContextMenu: {
                        edit: { text: "Edit", icon: OrgChart.icon.edit(18, 18, '#039BE5') },
                        add: { text: "Add", icon: OrgChart.icon.add(18, 18, '#FF8304') }
                    },


                    nodeMenu: {
                        details: { text: "Details" },
                        edit: { text: "Edit" },
                        add: { text: "Add" },

                        remove: { text: "Remove" }
                    }

                });


                $.ajax({
                    type: "POST",
                    url: 'WebForm1.aspx.cs/ReadData',
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    success: function (response) {
                        if (response != null && response.d != null) {
                            var data = response.d;//this data already json you can iterate with each
                            $.each(data, function (index, node) {
                                console.log(node);
                            });

                        }; 

                chart.on('add', function (sender, n) {
                    $.ajax({
                        type: 'POST',
                        url: '<%= ResolveUrl("WebForm1.aspx.cs/Add") %>',
                        data: JSON.stringify(n),
                        contentType: 'application/json; charset=utf-8',
                        dataType: 'json'
            });
        }); 
                chart.on('remove', function (sender, uo) {
                    $.ajax({
                        type: 'POST',
                        url: '<%= ResolveUrl("WebForm1.aspx.cs/Remove") %>',
                data: JSON.stringify({ uo: uo }),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json'
            });
        });
                chart.on('update', function (sender, oldNode, newNode) {
                    $.ajax({
                        type: 'POST',
                        url: '<%= ResolveUrl("WebForm1.aspx.cs/Update") %>',
                data: JSON.stringify({ oldNode: oldNode, newNode: newNode }),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json'
                    });

                });

                chart.load(<%= Session["Nodes"] %>); 



                });

    </script>



            <select style="position: absolute;right: 90px;top: 30px;color: #7a7a7a;font-size: 14px;padding: 10px;background-color: #F57C00;color: #ffffff;width: 100px;z-index:2;" id="selectTemplate">
        <option>luba</option>
        <option>olivia</option>
        <option>derek</option>
        <option>diva</option>
        <option>mila</option>
        <option>polina</option>
        <option>mery</option>
        <option>rony</option>
        <option>belinda</option>
        <option>ula</option>
        <option>ana</option>
        <option>isla</option>
        <option>deborah</option>
    </select>


</body>
</html>

#1楼 票数:1 已采纳

首先,您应该使函数static并添加WebMethod属性:

[WebMethod()]
public static List<Node> ReadData() 
{
  //..
}

那么您不需要将响应转换为 JSON,因为数据已经是 JSON。 您可以直接使用它,如下所示:

$.ajax({
  type: "POST",
  url: 'WebForm1.aspx/ReadData',
  dataType: "json",
  contentType: "application/json; charset=utf-8",
  success: function(response) {
    if (response != null && response.d != null) {
       var data = response.d;//this data already is json which represent list of Node so that you can iterate with each
       $.each(data, function (index, node) {
           console.log(node);
       });
    }
  }
}; 

另外 url 必须是WebForm1.aspx/ReadData而不是WebForm1.aspx.cs/ReadData

#2楼 票数:0

将方法的返回类型更改为 JsonResult 并返回带有主题和描述的新 Json 对象。

public JsonResult ReadData() {
   // Rest of your code 

   return Json(new { data = list, subject = "My subject", description = "My Description" });
}

查询:

  $(function () {
            $.ajax({
                type: "POST",
                url: 'Home/ReadData',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (response) {
                    if (response != null && response.data != null) {
                        var data = response.data;
                        alert(typeof (data));
                        alert('subject: ' + response.subject);
                        alert('description: ' + response.description);
                    }
                }
            })
        });

  ask by Oumaima El Kouira translate from so

未解决问题?本站智能推荐:

3回复

将Json对象从Asp.net webMethod返回到Ajax调用

我有以下Ajax调用方法和asp.net webmethod。 我的asp.net函数在Ajax调用中返回一些我需要的值。 我已经尝试过很多东西,但还没有成功。 AJAX CALL WebMethod asp.net 答案后更新
2回复

从Ajax调用C#网络方法

我需要调用此类中定义的Web方法 我已经像这样打了一个Ajax电话 呼叫失败的问题,在chrome控制台中,我得到了这个!
3回复

WebMethod的Ajax调用未返回响应

我有一个简单的代码,可以使用WebMethod通过简单的Ajax调用来更新数据库,但不能在数据库中进行更新。 HTML标记 客户端方法: 服务器端方法: 它在超链接的click事件上发布正确的值,但不更新数据库。
2回复

如何调用 WebMethod 以使用 ajax 返回 json?

每次我尝试这个时都会得到 404。 我在我的代码中找不到错误。 我有其他 webmethod 可以删除,它可以工作。 我正在使用 WebForm ,ADO.NET 和连接字符串,.NET 4.5。 这是ajax调用: 编辑:我试过这个,但它不起作用,我再次得到 404:
3回复

Asp.net 中的 Ajax 调用([WebMethod] 函数未调用)

我正在开发一个相当大的应用程序。 但是我在 Ajax 中遇到了问题。 为此,我尝试制作一个新的简短程序来调用 Ajax 以进行测试。 但我陷入了困境。 这是 Test.aspx 代码 Ajax 函数是 Test.aspx.cs 代码如下 当我在 TextBox 中放入一些值时。 它提
3回复

对Webmethod的Ajax调用给出错误500内部服务器错误

我试图通过ajax调用来调用Web方法。 jQuery代码是: 网络方法代码为: 但是我得到了错误500内部服务器错误和ajax调用中的错误功能被称为警报'0'。请帮助我尝试了几乎所有操作!
1回复

Javascript Ajax调用asp.net webmethod,内部服务器错误

我有一个网页,它允许用户在序列号扫描一段JavaScript代码,然后将其应发送到那些一个WebMethod,其中一个数据库,它记录和txtfile被制成。 Web方法中的内容无关紧要,因为代码永远不会运行。 (即使删除整个方法,只是将布尔值更改为true,例如返回相同的错误)。 这是
1回复

JQuery Ajax WebMethod返回一个对象

我在C#中有一个通过Jquery ajax方法调用的Web方法。 Web方法应该将一个对象返回给将用于填充的Jquery。 我试过返回一个JsonResult对象,实际对象似乎没什么用! 我没有使用MVC(不幸的是)。 有没有办法可以从我的web方法返回一个可以由我的AJAX方法使用