将回调结果写入页面

Question

我一直在寻找几个小时试图弄清楚如何将我的回调结果写入我的网页。这是一个相当具体的问题，但我遇到的任何解决方案都没有真正奏效。以下是详细信息：

伪代码：（理想情况下）

1. 用户与网页交互（在这种情况下，更改边界 在谷歌地图内）。
2. 在 bounds_changed 时，javascript 会抓取 限制并通过 JSON 格式的 jquery 回调将它们发送到我的 C# 代码。
3. C#代码处理边界并将搜索结果以JSON的形式返回到网页以供javascript操作。

第 3 步的第二部分是问题点（其他一切正常）。我似乎无法在回调完成后动态地写出结果。

以下是相关代码：

从客户端向服务器发送消息：（这可行，但只是为了完整性而包含它）

function toServer(data) {
    var dataPackage = data + "~";
    jQuery('form').each(function () {
        document.getElementById('payload').value = JSON.stringify({ sendData: dataPackage });
        $.ajax({
            type: "POST",
            async: true,
            url: window.location.href.toString(),
            data: jQuery(this).serialize(),
            success: function (result) {
                console.log("callback compelete");
            },
            error: function(error) {
                console.log("callback Error");
            }
        });
    });
}

页面加载时的服务器代码：（注意这不起作用[searchResults的写作]）

        public Map_ResultsViewer_Beta(...)
        {
            ...

            //holds actions from page
            string payload = HttpContext.Current.Request.Form["payload"] ?? String.Empty;

            // See if there were hidden requests
            if (!String.IsNullOrEmpty(payload))
            {
                //temp: process the request //2do: make this dynamic
                string temp_AggregationId = CurrentMode.Aggregation;
                string[] temp_AggregationList = temp_AggregationId.Split(' ');
                Perform_Aggregation_Search(temp_AggregationList, true, Tracer);

                //NOTHING BELOW THIS REALLY WORKS, ignore the the 'placeholder' method of displaying the results, it was just one attempt.

                #region 

                // Start to build the response
                StringBuilder mapSearchBuilder = new StringBuilder();
                PlaceHolder MainPlaceHolder = new PlaceHolder();

                mapSearchBuilder.AppendLine("  ");
                mapSearchBuilder.AppendLine("     <script type=\"text/javascript\"> ");
                mapSearchBuilder.AppendLine("     function processCallbackResult(){ ");

                if (!string.IsNullOrEmpty(HttpContext.Current.Session["SearchResultsJSON"].ToString()))
                {
                    mapSearchBuilder.AppendLine("     var searchResults=" + HttpContext.Current.Session["SearchResultsJSON"] + ";");
                }
                else
                {
                    mapSearchBuilder.AppendLine("     var searchResults; ");
                }

                mapSearchBuilder.AppendLine("     } ");
                mapSearchBuilder.AppendLine("     </script> ");
                mapSearchBuilder.AppendLine("  ");

                // Add this to the page
                Literal writeData = new Literal { Text = mapSearchBuilder.ToString() };
                MainPlaceHolder.Controls.Add(writeData);

                #endregion

            }
            else
            {
                //string temp_AggregationId = CurrentMode.Aggregation;
                //string[] temp_AggregationList = temp_AggregationId.Split(' ');
                //Perform_Aggregation_Search(temp_AggregationList, true, Tracer);
                HttpContext.Current.Session["SearchResultsJSON"] = "";
            }

        }

实际执行搜索：（这行得通，只是为了完整起见把它放在这里）

        public void Perform_Aggregation_Search(...)
        {
            //search the database for all items in all of the provided aggregations and merge them into one datatable
            List<DataTable> temp_Tables = new List<DataTable>();
            DataTable searchResults = new DataTable();
            foreach (string aggregationId in aggregationIds)
            {
                temp_Tables.Add(Database.Get_All_Coordinate_Points_By_Aggregation(aggregationId, Tracer));
            }
            foreach (DataTable temp_Table in temp_Tables)
            {
                searchResults.Merge(temp_Table);
            }

            //assign and hold the current search result datatable, from now on we will be using this as the base layer...
            HttpContext.Current.Session["SearchResults"] = searchResults;

            //call json writer with these results
            string searchResultsJSON = Create_JSON_Search_Results_Object(searchResults,Tracer);

            //send json obj to page and tell page to read it (via callback results)
            HttpContext.Current.Session["SearchResultsJSON"] = searchResultsJSON;

        }

创建 JSON 对象的代码：（这可行，只是为了完整起见将其放在这里）

        public string Create_JSON_Search_Results_Object(...)
        {
            //take the search results from db query (incoming) and parse into JSON
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
            Dictionary<string, object> row = null;
            foreach (DataRow dr in searchResults.Rows)
            {
                row = new Dictionary<string, object>();
                foreach (DataColumn col in searchResults.Columns)
                {
                    row.Add(col.ColumnName.Trim(), dr[col]);
                }
                rows.Add(row);
            }
            //return JSON object
            return serializer.Serialize(rows);
        }

我错过了什么吗？我究竟做错了什么？你能指出我的写作方向吗？

再一次，问题在于将回调的结果写入页面。

谢谢！

Answer 1

您需要在您的 ajax 帖子的 success 方法中对 JSON 进行实际操作。

您可以像这样使用 JQuery 来定位 DOM 节点：

$('.example').html(result);