Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1315
Client Side Data Binding From Page Method
posted

I trying to DataBind to a WebDataGrid from the client side from a page method.  I'm really close but I'm getting the following error message:

Unable to get value of the property  set_dataSource  object is null or undefined

Here is my form file contents:

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="ztest2.aspx.vb" Inherits="labor.ztest2" %>
<%@ Register assembly="Infragistics35.Web.v11.1, Version=11.1.20111.2178, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.Web.UI.LayoutControls" tagprefix="ig" %>
<%@ Register assembly="Infragistics35.Web.v11.1, Version=11.1.20111.2178, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.Web.UI.GridControls" tagprefix="ig" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="Head1" runat="server">
 <script type="text/javascript" src="jquery-1.7.1.js"></script>
 <title></title>
</head>

<script type="text/javascript">
   
    var tabelem = null;
    function WebTab1_SelectedIndexChanging(sender, eventArgs)
        {
            var tabnum = eventArgs.get_tabIndex();
            var tab = $find("WebTab1");
            var tabid = tab.get_tabs()[tabnum];
            var tabfield = null;

            if (tabnum == 0)
            {
                tabfield = tabid.findChild('qty1');
                tabelem = tabfield;
                window.setTimeout('try{tabelem.focus();}catch(ex){}', 1);
            } 
                     
            if (tabnum == 1)
            {
                tabfield = tabid.findChild('qty2');
                tabelem = tabfield;
                window.setTimeout('try{tabelem.focus();}catch(ex){}', 1);
            }
           
            if (tabnum == 2)
            {
                tabfield = tabid.findChild('qty3');
                tabelem = tabfield;
                window.setTimeout('try{tabelem.focus();}catch(ex){}', 1);
            }
        }

    function QtyChange()
        {
            var totsale, qty, price;
            var parms;

            totsale = 0;
            qty = 0;
            price = 0;
            parms = "";

            qty = $get('<%=qty1.ClientID%>').value;
            price = $get('<%=price1.ClientID%>').value;
            totsale = qty * price;
            document.getElementById("<%=totsale1.ClientID%>").value = totsale;

            parms = '{"qty":"' + qty + '"}';

            $.ajax({ type: "POST", url: "ztest2.aspx/QtyMsg", data: parms, contentType: "application/json; charset=utf-8", datatype: "json",
                     success: function(datatable)
                     {
                      var qtygrid = $find("WebDataGrid1");
                      qtygrid.set_dataSource(datatable.d);
                      qtygrid._pi.show(qtygrid);
                      qtygrid.applyClientBinding();
                      qtygrid._pi.hide(qtygrid);
                     }
            });
        }       

      
</script>

<body>

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True"></asp:ScriptManager>
<table>
 <tr>
  <td>
   <ig:WebTab ID="WebTab1" runat="server" Height="400px" Width="650px">
    <tabs>
        <ig:ContentTabItem runat="server" Text="Sales Scenario 1">
            <Template>
             <br />
             <table>
              <tr>
               <td><asp:Label ID="Label1" runat="server" Font-Bold="True" Text="Quantity"></asp:Label></td>
               <td><asp:TextBox ID="qty1" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="1" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label2" runat="server" Font-Bold="True" Text="Price"></asp:Label></td>
               <td><asp:TextBox ID="price1" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="2" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label3" runat="server" Font-Bold="True" Text="Total Sales"></asp:Label></td>
               <td><asp:TextBox ID="totsale1" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="3" Width="70px" BackColor="PaleGoldenrod"></asp:TextBox></td>
              </tr>
             </table>
            </Template>
        </ig:ContentTabItem>
        <ig:ContentTabItem runat="server" Text="Sales Scenario 2" Hidden="True">
            <Template>
             <br />
             <table>
              <tr>
               <td><asp:Label ID="Label4" runat="server" Font-Bold="True" Text="Quantity"></asp:Label></td>
               <td><asp:TextBox ID="qty2" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="5" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label5" runat="server" Font-Bold="True" Text="Price"></asp:Label></td>
               <td><asp:TextBox ID="price2" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="6" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label6" runat="server" Font-Bold="True" Text="Total Sales"></asp:Label></td>
               <td><asp:TextBox ID="totsale2" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="7" Width="70px" BackColor="PaleGoldenrod" ReadOnly="true"></asp:TextBox></td>
              </tr>
             </table>
            </Template>       
        </ig:ContentTabItem>
        <ig:ContentTabItem runat="server" Text="Sales Scenario 3" Hidden="True">
            <Template>
             <br />
             <table>
              <tr>
               <td><asp:Label ID="Label7" runat="server" Font-Bold="True" Text="Quantity"></asp:Label></td>
               <td><asp:TextBox ID="qty3" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="9" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label8" runat="server" Font-Bold="True" Text="Price"></asp:Label></td>
               <td><asp:TextBox ID="price3" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="10" Width="70px"></asp:TextBox></td>
               <td>&nbsp;&nbsp;</td>
               <td><asp:Label ID="Label9" runat="server" Font-Bold="True" Text="Total Sales"></asp:Label></td>
               <td><asp:TextBox ID="totsale3" runat="server" Font-Bold="True" Font-Names="Arial" TabIndex="11" Width="70px" BackColor="PaleGoldenrod" ReadOnly="true"></asp:TextBox></td>
              </tr>
             </table>
            </Template>       
        </ig:ContentTabItem>
    </tabs>
    <ClientEvents SelectedIndexChanging="WebTab1_SelectedIndexChanging" />
   </ig:WebTab>
  </td>
  <td>&nbsp;&nbsp;</td>
  <td>
   <ig:WebTab ID="WebTab2" runat="server" Height="400px" Width="650px">
    <tabs>
        <ig:ContentTabItem runat="server" Text="Grid Display 1">
            <Template>
             <br />
             <table>
              <tr>
               <td><ig:WebDataGrid ID="WebDataGrid1" runat="server" Height="150px" Width="500px" /></td>
              </tr>
              <tr>
               <td>&nbsp;</td>
              </tr>
              <tr>
               <td><ig:WebDataGrid ID="WebDataGrid2" runat="server" Height="150px" Width="500px" /></td>
              </tr>            
             </table>
            </Template>
        </ig:ContentTabItem>
    </tabs>
   </ig:WebTab>
  </td>
 </tr>
</table>
<br />
<asp:Button ID="salebutt" runat="server" Text="New Sales Scenario" Font-Bold="True" />

</form>

</body>

</html>


And here is my code behind:


Imports System.Web.Script.Serialization
Imports Infragistics.Web.UI.GridControls
Imports Infragistics.Web.UI.LayoutControls

Partial Public Class ztest2
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        Dim confocus, jsfocus As String

        confocus = qty1.ClientID
        jsfocus = "window.setTimeout(""try{document.getElementById('" & confocus & "').focus();} catch(e){}"",1000);"
        ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "TabFocusKey", jsfocus, True)

        qty1.Attributes.Add("onchange", "BLOCKED SCRIPTQtyChange()")

    End Sub

    Protected Sub salebutt_Click(ByVal sender As Object, ByVal e As EventArgs) Handles salebutt.Click

        Dim tabflag As String

        tabflag = ""

        If WebTab1.Tabs(1).Hidden = True Then
            tabflag = "Y"
            WebTab1.Tabs(1).Hidden = False
            totsale2.BackColor = Drawing.Color.PaleGoldenrod
            totsale2.Font.Bold = True
        End If
        If WebTab1.Tabs(2).Hidden = True And Len(Trim(tabflag)) = 0 Then
            tabflag = "Y"
            WebTab1.Tabs(2).Hidden = False
            totsale3.BackColor = Drawing.Color.PaleGoldenrod
            totsale3.Font.Bold = True
        End If

    End Sub

    <System.Web.Services.WebMethod()> _
    Public Shared Function QtyMsg(ByVal qty As String) As String

        Dim serializer As JavaScriptSerializer = New JavaScriptSerializer
        Dim tabrows As New List(Of Dictionary(Of String, Object))
        Dim tabrow As Dictionary(Of String, Object)
        Dim dtrow As DataRow
        Dim dttab As New DataTable()

        If IsNumeric(qty) Then
        Else
            qty = 0
        End If

        dttab.Columns.Add("Quantity Message", System.Type.GetType("System.String"))
        dtrow = dttab.NewRow

        If CDec(qty) <= 500 Then
            dtrow(0) = "Quantity Less Than Equal To 500"
        End If
        If (CDec(qty) >= 501 And CDec(qty <= 1000)) Then
            dtrow(0) = "Quantity Is Between 501 And 1000"
        End If
        If (CDec(qty) >= 1001 And CDec(qty <= 1500)) Then
            dtrow(0) = "Quantity Is Between 1001 And 1500"
        End If
        If (CDec(qty) >= 1501 And CDec(qty <= 2000)) Then
            dtrow(0) = "Quantity Is Between 1501 And 2000"
        End If
        If CDec(qty) >= 2001 Then
            dtrow(0) = "Quantity Over What We Expected!!!"
        End If

        dttab.Rows.Add(dtrow)

        For Each dr As DataRow In dttab.Rows
            tabrow = New Dictionary(Of String, Object)

            For Each dc As DataColumn In dttab.Columns
                tabrow.Add(dc.ColumnName, dr(dc))
            Next

            tabrows.Add(tabrow)
        Next

        Return serializer.Serialize(tabrows)

    End Function

End Class


What am I missing?  I'm on version 11.1