Question

I am working on a project where I succesfully made web servie calls via ajax, returned the data, and binded single line results to text boxes. However, there are cases where a field such as account, might have multiple values, and indexed in my case. I am able to hard code the returned results and bind it, but i need to do it dynamically and not hard code it because the web service call could return different number of lines depending on the data given to it. Here is some of the code:

 function RetrieveEntity() {
 var pageUrl1 = "ajaxwebservicecalls.asmx/RetrieveEntity";
    $.ajax({
        type: "POST",
        url: pageUrl1,
        data: {},
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        success: OnretrieveSuccessCall,
        error: onretrieveFail
    });


}
function OnretrieveSuccessCall(msg) {
    var defaultdata = msg.d.Data;
    invoiceModel = defaultdata;
    var x = JSON.stringify(defaultdata);
    MyProject.viewModel = ko.mapping.fromJS(invoiceModel);
    ko.applyBindings(MyProject.viewModel)
alert("hello");
}

(No need to show the webservice asmx file because that part works fine)
the returned results look similar to this:

  header1.value = "abc"
  header2.value = "efg"

so when i bind it to a text box, all i have to do is call data-bind=”value: header1.value” and that works fine

However, multiple line results are returned in an indexed formart as follows:

Header1[(value1=xxx,value2=yyyy,value3=zzz),(value1=ddd,value2=fff,value3=fgghg)] 

so when i databind it (hardcoded value), i used

data-bind="value:header1()[0].value1" 

and that returns “xxx”

my problem is if i want to return all answers for value1 (xxx, ddd) and bind them on a grid. I used a template field grid, and placed a text box inside it, and tried to retrieve the value using a hardcoded index it worked. But when i wanted to return all possible values (using #index or $data0 it didn’t work. I’m not sure how to use it, and if it’s even possible to an ASP bind a gridview using knokcoutjs. please help me out. Below is the HTMl code (i will show one gridview field only, and i’m using the hardcoded index that is working).

 <asp:GridView ID="GridView2" runat="server"AllowPaging="True"AutoGenerateColumns="False">    
 <Columns>
 <asp:TemplateField HeaderText="Account" SortExpression="Account" >
  <ItemTemplate>
    <asp:TextBox ID="Account" runat="server" MaxLength="60" ReadOnly="true" 
     TabIndex="-1" Style="width: 250px" data-bind="value:APInvoiceItems()[0].Accountnumber"/>
                </ItemTemplate>
         </asp:TemplateField>
  </Columns>
    </asp:GridView>
<button onclick=" RetrieveEntity()"> Update </button>

the account number at index zero is returned from the above code. How to return index 1, 2 and so on?
All help is greatly appreciated. Thank you in advance!!

Answer 1

That’s not possible. GridVew is a server control so you can bind data to it only on server. Consider to use some JavaScript template engine like jsRender, doT, Underscore etc. to create layout from service response.