在Javascript中用对象数组创建HTML表 [英] Create HTML table out of object array in Javascript

问题描述

我正在从javascript调用网络方法.Web方法从Northwind数据库返回一组客户.我正在使用的示例在此处:使用ASP.NET调用Web服务AJAX

I am calling a web Method from javascript. The web method returns an array of customers from the northwind database. The example I am working from is here: Calling Web Services with ASP.NET AJAX

我不知道如何编写此javascript方法: CreateCustomersTable

I dont know how to write this javascript method: CreateCustomersTable

这将创建html表以显示返回的数据.任何帮助将不胜感激.

This would create the html table to display the data being returned. Any help would be appreciated.

我的JavaScript

My javascript

function GetCustomerByCountry() {
  var country = $get("txtCountry").value;
  AjaxWebService.GetCustomersByCountry(country, OnWSRequestComplete, OnWSRequestFailed);
}
function OnWSRequestComplete(results) {
    if (results != null) {
        CreateCustomersTable(results);
        //GetMap(results);
    }
}
function CreateCustomersTable(result) {
    alert(result);
if (document.all) //Filter for IE DOM since other browsers are limited
{
   // How do I do this?
    }
}
else { 
$get("divOutput").innerHTML = "RSS only available in IE5+"; }
}

我的网络方法

    [WebMethod]
    public Customer[] GetCustomersByCountry(string country) 
    {
        NorthwindDALTableAdapters.CustomersTableAdapter adap =
           new NorthwindDALTableAdapters.CustomersTableAdapter();
        NorthwindDAL.CustomersDataTable dt = adap.GetCustomersByCountry(country);

        if (dt.Rows.Count <= 0)
        {
            return null;
        }

        Customer[] customers = new Customer[dt.Rows.Count];
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            NorthwindDAL.CustomersRow row = (NorthwindDAL.CustomersRow)dt.Rows[i];
            customers[i] = new Customer();
            customers[i].CustomerId = row.CustomerID;
            customers[i].Name = row.ContactName;
        }
        return customers;
    }

推荐答案

尝试查看调试模式下的结果变量值是多少.如果该结构看起来像我想象中的结构，则可以执行以下操作:

Try to look what is the result variable value in debug mode. If the structure seems the structure that i'm imagining, something like this could work:

function CreateCustomersTable(result) {
    var str = '<table>'; 
    str += '<tr><th>Id</th><th>Name</th></tr>';
    for ( var i=0; i< result.length; i++){
        str += '<tr><td>' + result[i].CustomerId + '</td><td>' + result[i].Name + '</td></tr>';
    }
    str += '</table>';
    return str;    
}

然后您可以执行以下操作:

And then You can do somethig like this:

var existingDiv = document.getElementById('Id of an existing Div');
existingDiv.innerHTML = CreateCustomersTable(result);

希望对您有帮助.

这篇关于在Javascript中用对象数组创建HTML表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！