Jquery + AJAX + ASP.Net + WebForms

Question

Jquery + AJAX + ASP.Net + WebForms

3

我需要帮助将一些 JQuery AJAX 数据 POST 到后台的 C# WebForm。这会 POST 到一个静态字符串 WebForm 方法，该方法返回一个值，然后 JQuery 使用该值来更改 HTML 中的图像 URL。所有都很顺利。

然而，我想扩展现有代码的功能（虽然我不排斥全面重写），以允许我从 C# 后端操纵前端 ASP 控件。由于所述静态字符串方法充当我的 WebForm，我无法实现此目标。

有人有任何想法可以帮忙解决我的困境吗？

后端

    [System.Web.Services.WebMethod]
    public static string ImageLoad(string address)
    {
        //if fail
        return "/Unavailable.bmp";

        //if succeed
        return "myimage.jpg";
        //third option
        else
        return "myotherimage.jpg";
    }

JQuery/AJAX

function scriptImageLoad() {
   var address = $("#txtAddress").val();
       $.ajax({
           type: "POST",
           url: "myPage.aspx/ImageLoad",
           data: "{'address':'" + address.toString() + "'}",
           contentType: "application/json; charset=utf-8",
           dataType: "text",
           success: function (output) {
                $('#imgImage').attr('src', output);
           }
       });
   }
});

- Kevin

3个回答

2

处理服务器控件需要某种类型的回发(postback)。

在这种情况下，更新面板(update panel)是您与asp.net控件一起工作的唯一选择。

但我建议找到另一种方法 - 更新面板是邪恶的，会给您带来疣。是那种不好的。

- Sky Sanders

@joo - 不会很快。但我永远不会自由 - codeplex 是一个巨大的更新面板，我有几个项目在那里。将来会成为更新面板的用户/受害者。 ;-\ - Sky Sanders

0

在同事的帮助下，我开发了一个不同的解决方案。一种结构保存所需的输出数据，然后将其转换为字符串数组，最后通过静态字符串Web方法返回。一旦返回到Jquery，数据就会通过数组的不同索引推送到它需要去的地方。

前端

function scriptImageLoad() {
   var address = $("#txtAddress").val();
      $.ajax({
         type: "POST",
         url: "MyForm.aspx/MyMethod",
         data: "{'address':'" + address.toString() + "'}",
         contentType: "application/json; charset=utf-8",
         dataType: "JSON",

         success: function (output) {
            $.each(output, function (index, value) {
               place value in form
               return (index != 0);
            })
            $.each(output, function (index, value) {
               place value in form
               return (index != 1);
            })
            $.each(output, function (index, value) {
               place value in form
               return (index != 2);
            })
            $.each(output, function (index, value) {
               $('#imgImage').attr('src', this);
               return (index != 3);
            })
         }

后端

    public struct TestStruct
    {
        public string value1;
        public string value2;
        public string value3;
        public string value4;

        public TestStruct(string value1, string value2, string value3, string value4)
        {
            this.value1 = value1;
            this.value2 = value2;
            this.value3 = value3;
            this.value4 = value4;
        }
    }

    [System.Web.Services.WebMethod]
    public static string[] MyMethod(string address)
    {
        string[] returnarray = new string[4];
        TestStruct struct;
        struct.value1 = "";
        struct.value2 = address;
        struct.value3 = "";
        struct.value4 = "/Unavailable.bmp";

        //if fail, return default values
                returnstring.SetValue(struct.value1, 0);
                returnstring.SetValue(struct.value2, 1);
                returnstring.SetValue(struct.value3, 2);
                returnstring.SetValue(struct.value4, 3);
                return returnstring;

        //if succeed
                struct.values = processed values;
                set the values on returnstring
                return returnstring;
        //else
                struct.values = other processed values;
                set the values on returnstring
                return returnstring;
    }

现在我唯一的问题是如何让Jquery正确地向客户端显示数据。

- Kevin

我通过将所有的“.this”标签替换为“.value”标签，使其正常工作。 - Kevin

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- jrummell · Accepted Answer

使用 WebService。这将使您能够在网站的任何地方使用jQuery调用服务。

function scriptImageLoad() {
   var address = $("#txtAddress").val();
       $.ajax({
           type: "POST",
           url: "MyService.asmx/ImageLoad",
           data: "{'address':'" + address.toString() + "'}",
           contentType: "application/json; charset=utf-8",
           dataType: "text",
           success: function (output) {
                $('#imgImage').attr('src', output);
           }
       });
   }
});

[WebService, ScriptService]
public class MyService : WebService
{
    [ScriptMethod]
    public static string ImageLoad(string address)
    {
        //if fail
        return "/Unavailable.bmp";

        //if succeed
        return "myimage.jpg";
        //third option
        else
        return "myotherimage.jpg";
    }
}