ajax代码中的数据无法显示

时间:2013-10-26 05:35:55

标签: asp.net ajax

我有li标签,其中包含指向不同页面的链接。现在我想通过点击特定的li标签来创建一个searcj。我希望当用户点击名为“Field Workers”的li时,会出现一个包含数据库中所有现场工作人员姓名的子项。 Ajax代码用于显示现场工作人员。我在ajax cide中获取数据,但不知怎的,它没有显示出来。任何人都可以帮我这个吗?

Ajax代码:

 <script>  
 var ajaxOptions = {
                    type: "POST", url: null, success: null, async: true,
                    data: "", dataType: "json", contentType: "application/json; charset=utf-8"
                }

   $(function () {
                    BindFW();                        
                })
        function BindFW() {
                    ajaxOptions.data = "";
                    ajaxOptions.url = "WebForm1.aspx/BindFieldWorkers"
                    ajaxOptions.success = function (result) {
                        if (result.d != null && result.d != "") {
                            //$("#templateFW").tmpl(result.d).appendTo("#ulFW");
                            $.each(result.d, function () {
                                $('#ulFW').append();

                            });
                        }
                    }
                    $.ajax(ajaxOptions);
                }
  </script>



  <ul>
  <li  class="has-sub">
                    <a href="javascript:;">
                        <i class="icon-search"></i>
                        <span class="title">Field Worker Name</span>
                        <span class="arrow "></span>
                    </a>
                    <ul id="ulFW" class="sub">
                    </ul>
                </li>
</ul>

1 个答案:

答案 0 :(得分:0)

使用此脚本:

$(document).ready(function () {
            BindFW(10);
        });

        function BindFW(StateId) {

            var data = {
                StateId: StateId
            };

            $.ajax({
                type: 'POST',
                url: './WebForm1.aspx/BindFieldWorkers',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                data: JSON.stringify(data),
                success: function (data) {
                    if (!data.d['Result']) {
                        alert('no records found!');
                        return;
                    }

                    var records = data.d['Records'];

                    for (var i = 0; i < records.length; i++) {
                        $('#ulFW').append(function () {
                            return $('<li>').text(records[i].Text).attr('data-id', records[i].ID)
                        });
                    }

                },
                error: function (data) {
                    alert('failed to connect to server!');
                }

            });
        }

这在你的代码背后:

[System.Web.Services.WebMethod]
    public static object BindFieldWorkers(int StateId)
    {

        try
        {
            List<object> result = new List<object>();

            for (int i = 0; i < 10; i++)
            {
                result.Add(new
                {
                    ID = i,
                    Text = "Text " + i
                });
            }

            return new { Result = true, Records = result };
        }
        catch (Exception ex)
        {
            return new { Result = false, Message = ex.Message };
        }

    }