Pass parameter from asp.net to javascript.

Recently we have a requirement to put a checkbox in every gridview row, but only maximum rows allow to be selected, if you select more, the javascript need to alert you. The thing is the maximum number should get from web.config and shouldn’t be hard coded, so how pass the backend asp.net argument to the front javascript? There is a few ways to pass, but the following is working for me than others, for example using code block

Backend aspx.vb page:

    Private Sub gridview_RowDataBound(sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gdvw_Survey.RowDataBound
        Dim ck As CheckBox
        Try
            If e.Row.RowType = DataControlRowType.DataRow Then
                ck = DirectCast(e.Row.FindControl("ckselected"), CheckBox)
                ck.Attributes.Add("OnClick", "CheckGridList(" & DataController.getMaxNumber & ")")
            End If
        Catch ex As Exception
            Throw
        End Try
    End Sub

Frontend page:

javascript:

  <script type="text/javascript">
        function CheckGridList(maxnumber)
               {      
                var count = 0;
                for (i=0; i < document.forms[0].elements.length; i++)
                    {           
                        if (document.forms[0].elements[i].type == 'checkbox') 
                        {
                            if (document.forms[0].elements[i].checked == true)
                            {                                   
                            count++; 
                            if (count > maxnumber)
                                {
                                    document.forms[0].elements[i].checked = false;                       
                                    break;
                                }
                            }
                        }
                    }
                    if (count > maxnumber)
                    {
                        alert("Only 5 items can be selected at one time.");
                        return false;
                    }
                    else { return true;}
                }
 </script>

                 <asp:GridView ID="gridview" runat="server" CellPadding="4" GridLines="None" AutoGenerateColumns="False" DataKeyNames="ID"  Width = "100%">
                       <Columns>

                            <asp:BoundField DataField="ID" HeaderText="" ReadOnly="True" Visible="False"/>  

                            <asp:BoundField DataField="Order" HeaderText="Number"  >
                                <ItemStyle Font-Size="Small" HorizontalAlign="Center" Font-Names="Arial" />
                                <HeaderStyle Font-Size="Small" HorizontalAlign="Center" Font-Names="Arial"/>
                            </asp:BoundField> 

                            <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:CheckBox ID="ck" runat="server" Checked="false" />
                                </ItemTemplate>
                            </asp:TemplateField>
                    

                            <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width = "90%" >
                                <ItemStyle Font-Size="Small" HorizontalAlign="Left"   Font-Names="Arial"/>
                                <HeaderStyle Font-Size="Small" HorizontalAlign="Center" Font-Names="Arial" />
                            </asp:BoundField>
                                                       

                          
                        </Columns>
                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />          
                        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                        <EmptyDataTemplate>
                            <asp:CheckBox ID="ckladjust" runat="server" Checked="True" />
                        </EmptyDataTemplate>
                    </asp:GridView>
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s