0

我有一个 web 服务，它是一个列出所有记录的数组函数。但是，我想在视图模型中调用它并将其绑定到我的表。这是我所得到的并且现在被卡住了。感谢您的帮助或建议。

网络服务

 [WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)] //used to output response format into JSON rather than XML
public records[] list(string appName, int userId, string filterFields)
{
    records[] thisrecord = new records[1];

    int currentRow = 0;
    try
    {
           SQLText = "SELECT id,name FROM REcordTable order by name";
    // Connect to Database
        {
            using (DbCommand cmd = vcConnect.getDataCommand(appName, conn, SQLText))  
            {
                using (DbDataReader rdr = vcConnect.getDataReader(appName, cmd))      // Read the returned resultset
                {
                    while (rdr.Read())
                    {
                        if (currentRow > 0)
                           Array.Resize(ref thisrecord, currentRow + 1);
                        thisrecord[currentRow].id = (int)rdr["id"];
                        thisrecord[currentRow].name = rdr["name"].ToString();
                        currentRow++;
                    }
                }
            }
        }
    }
    catch (Exception Ex)
    {

    }

    return thisrecord;
}

HTML

    <div id="records">
    <button title="button">Button</button>
    <table>
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: loop">
            <tr>
                <td data-bind="text: ViewModel.thisId"></td>
                <td data-bind="text: ViewModel.thisName"></td>
            </tr>
        </tbody>
    </table>
</div>

查看模型

var ViewModel = {
    loop: ko.observableArray([]);
    //I want to be able to call the webservice(records function) and be able to bind it  to the table and list out all the records.
    }

因此，我希望能够调用 webservice(records function) 并能够将其绑定到表并列出所有记录。

4

2 回答 2

3

html

<tbody data-bind="foreach: { data: records, as: 'record' }">
  <tr>
    <td data-bind="text: record.id"></td>
    <td data-bind="text: record.name"></td>
  </tr>
</tbody>

javascript

function Record( data ){
  this.id=data.id;
  this.name=ko.observable( data.name );
}

function RecordsViewModel(){
  var self=this;
  self.records=ko.observableArray();

  self.fetch=function(){
    $.ajax({
      type: 'get',
      dataType: 'json',
      url: 'url to service',
      //...
    })
    .done( function( data ){ // handle the data
      self.records( ko.utils.arrayMap( data, function( item ){
        return new Record( item );
      }));
    });
  }
}

实例化视图模型

var viewModel=new RecordsViewModel();
ko.applyBindings( viewModel );
viewModel.fetch();
于 2013-05-25T01:21:34.540 回答
1

您也可以使用 Ajax 调用该方法

像这样

$.ajax({
                        type: "GET",
                        url: "URL WITH Method Name",
                        contentType: false,
                        processData: false,
                        data: data,
                        success: function (results) {
                            var msg = new Array();
                            for (i = 0; i < results.length; i++) {
                                vm.loop.push({ id: results[i][0], name: results[i][1] });
                            }                               

                        }
                    });

然后您可以使用 KO 绑定进行绑定

<table>
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: loop">
            <tr>
                <td data-bind="text: Id"></td>
                <td data-bind="text: Name"></td>
            </tr>
        </tbody>
    </table>
于 2013-05-25T01:43:23.097 回答