Search code examples
javascriptasp.nettelerikradgrid

Error: The name 'RGGSTAcCode' does not exist in the current context


In one of the webpage, I have RadGrid inside FormView Control i.e., as below markup:

<asp:FormView ID="fvIPRForm" runat="server" DefaultMode="Insert" DataKeyNames="RequestID"
  DataSourceID="odsIPRForm" EnableModelValidation="True" OnItemInserting="fvIPRForm_ItemInserting"
  OnDataBound="fvIPRForm_DataBound" OnItemUpdating="fvIPRForm_Updating" OnItemCommand="fvIPRForm_ItemCommand">

<%-- Create New IPR--%>
<InsertItemTemplate>

<telerik:RadMultiPage ID="RadMultiPage5" runat="server" SelectedIndex="0" Width="100%">
<telerik:RadPageView ID="RadPageView4" runat="server" Width="100%">
<telerik:RadAjaxPanel ID="RadAjaxPanel4" runat="server">

//RadGrid
<telerik:RadGrid ID="RGGSTAcCode" runat="server" AutoGenerateColumns="false"....>
 //other code

<telerik:GridTemplateColumn UniqueName="AccountCode" HeaderText="Account Code">
  <ItemTemplate>
    <asp:Label ID="lblAcCode" Text='<%# Eval("AccountCode") %>' runat="server"></asp:Label>
  </ItemTemplate>
  <EditItemTemplate>
    <asp:Label ID="lblAcCode2" runat="server" Text='<%# Eval("AccountCode") + " - " + Eval("AccountDescription")%>' Visible="false"></asp:Label>     

    <telerik:RadComboBox ID="ddlAccountCode" runat="server" Height="200" Width="260"
    AllowCustomText="true" onclienttextchange="OnClientTextChange">
    </telerik:RadComboBox>

    <asp:Button ID="btnSearch" runat="server" Text="Search" OnClick="btnSearch_Click" OnClientClick="ButtonClicked()" UseSubmitBehavior="true" />&nbsp;                                      
  </EditItemTemplate>
</telerik:GridTemplateColumn>

</telerik:RadGrid>

</telerik:RadAjaxPanel>
</telerik:RadPageView>
</telerik:RadMultiPage>

</InsertItemTemplate>

<%-- Edit IPR--%>
<EditItemTemplate>

<telerik:RadMultiPage ID="RadMultiPage5" runat="server" SelectedIndex="0" Width="100%">
<telerik:RadPageView ID="RadPageView4" runat="server" Width="100%">
<telerik:RadAjaxPanel ID="RadAjaxPanel4" runat="server">

//RadGrid
<telerik:RadGrid ID="RGGSTAcCode" runat="server" AutoGenerateColumns="false"....>
 //other code

<telerik:GridTemplateColumn UniqueName="AccountCode" HeaderText="Account Code">
  <ItemTemplate>
    <asp:Label ID="lblAcCode" Text='<%# Eval("AccountCode") %>' runat="server"></asp:Label>
  </ItemTemplate>
  <EditItemTemplate>
    <asp:Label ID="lblAcCode2" runat="server" Text='<%# Eval("AccountCode") + " - " + Eval("AccountDescription")%>' Visible="false"></asp:Label>     

    <telerik:RadComboBox ID="ddlAccountCode" runat="server" Height="200" Width="260"
    AllowCustomText="true" onclienttextchange="OnClientTextChange">
    </telerik:RadComboBox>

    <asp:Button ID="btnSearch" runat="server" Text="Search" OnClick="btnSearch_Click" OnClientClick="ButtonClicked()" UseSubmitBehavior="true" />&nbsp;                                      
  </EditItemTemplate>
</telerik:GridTemplateColumn>

</telerik:RadGrid>

</telerik:RadAjaxPanel>
</telerik:RadPageView>
</telerik:RadMultiPage>

</EditItemTemplate>

 <%-- View IPR--%>
<ItemTemplate>

<telerik:RadMultiPage ID="RadMultiPage5" runat="server" SelectedIndex="0" Width="100%">
<telerik:RadPageView ID="RadPageView4" runat="server" Width="100%">
<telerik:RadAjaxPanel ID="RadAjaxPanel4" runat="server">

//RadGrid
<telerik:RadGrid ID="RGGSTAcCode" runat="server" AutoGenerateColumns="false"....>
 //other code

<telerik:GridTemplateColumn UniqueName="AccountCode" HeaderText="Account Code">
  <ItemTemplate>
    <asp:Label ID="lblAcCode" Text='<%# Eval("AccountCode") %>' runat="server"></asp:Label>
  </ItemTemplate>
  <EditItemTemplate>
    <asp:Label ID="lblAcCode2" runat="server" Text='<%# Eval("AccountCode") + " - " + Eval("AccountDescription")%>' Visible="false"></asp:Label>   

    <telerik:RadComboBox ID="ddlAccountCode" runat="server" Height="200" Width="260"
    AllowCustomText="true" onclienttextchange="OnClientTextChange">
    </telerik:RadComboBox>

    <asp:Button ID="btnSearch" runat="server" Text="Search" OnClick="btnSearch_Click" OnClientClick="ButtonClicked()" UseSubmitBehavior="true" />&nbsp;                                      
  </EditItemTemplate>
</telerik:GridTemplateColumn>

</telerik:RadGrid>

</telerik:RadAjaxPanel>
</telerik:RadPageView>
</telerik:RadMultiPage>

</ItemTemplate>

</asp:FormView>

Now, I try to get the RadGrid -- EditItemTemplate -- Button control inside JavaScript to make it visible true/false based on text length that user enter in RadComboBox.

Below is my JavaScript:

<script lang="javascript" type="text/javascript">
        function OnClientTextChange(sender, eventArgs) {
            //alert("You typed " + sender.get_text());

            var len = sender.get_text().length;
            alert(len);

            var form = $find("<%#RGGSTAcCode.ClientID%>").get_masterTableView();
            alert(form);

        }
</script>

When I run my web page, I always get below error:

The name 'RGGSTAcCode' does not exist in the current context

I tried to change the JavaScript code as below:

var form = document.getElementById('<%=fvIPRForm.FindControl("RGGSTAcCode").ClientID%>'); 
var masterTable = form.get_masterTableView();
alert(masterTable);

but then I get [object Object] in "alert". What is wrong in my code?

Edit

Tried below solution, all working except Buttons are not disabled/enabled inside if/else:

function onTextChange(sender, args) {
                //alert("You typed " + sender.get_text());
                var len = sender.get_text().length;
                alert(len);

                var comboID = sender.get_id();
                var btnSearchID = comboID.replace("ddlAccountCode", "btnSearch");
                alert("Alert 1: " + btnSearchID); //getting : contentplaceholder_fviIPRForm_RGGSTAcCode_btnSearch

                var btnCtrl = $get(btnSearchID);
                alert("Alert 2: " + btnCtrl); //getting : [object HTMLInputElement]

                if (len > 5) 
                {
                    alert("greater");

                    btnCtrl.set_enabled(true);
                    btnsearch.set_enabled(true); // enable search button                    
                }
                else 
                {
                    alert("less");

                    btnCtrl.set_enabled(false);
                    btnsearch.set_enabled(false); // disable search button                   
                }               
            }

Solution

  • Below code is working fine based on my requirement:

    function onTextChange(sender, args) {
                    var len = sender.get_text().length;
                    //alert(len);
    
                    var comboID = sender.get_id();
                    var btnSearchID = comboID.replace("ddlAccountCode", "btnSearch");
                    var btnCtrl = document.getElementById(btnSearchID);
    
                    if (len >= 5) 
                    {
                        btnCtrl.disabled = false;
                        //btnCtrl.style.display = "";
                    }
                    else 
                    {
                        btnCtrl.disabled = true;
                        //btnCtrl.style.display = "none";
                    }               
                }