Get grid's row index of valueChanged radTextBox

[Sammy78]

Hi,
I have a radGRid in which each row represent a customer and where I put several radTextBox in the cells so that the customers can input their info (firstname, lastname, etc.). I can have from 1 to 10 customers in the same grid.
I'm trying to get the row index where the value of a radTextBox as been changed.
I need to do this client side.

Any idea?
Thanks in advance

Sam

[Princy]

Hello Sam,

Try the following code snippet in 'OnvalueChanged' event of RadTextBox to get the editIndex of the row.

ASPX:

<telerik:GridTemplateColumn>
    <EditItemTemplate>
        <telerik:RadTextBox ID="RadTextBox1" runat="server" Text='<%#Bind("EmployeeID") %>'>
            <ClientEvents OnValueChanged="ValueChanged" />
        </telerik:RadTextBox>
    </EditItemTemplate>
</telerik:GridTemplateColumn>

Java Script:

<script type="text/javascript">
    function ValueChanged()
    {
        var index = $find("RadGrid1")._editIndexes;
        alert(index);
    }
</script>

Thanks,
Princy.

[Sammy78]

Hi Princy,
THanks for the quick reply. I tried the snippet that you've sent me, but the function never fires. I must be doing something wrong (or there's info that I didn't communicate and that was vital to the solution odf my problem). Here is how I build the radGrid:
VB:

Private Sub rgDetailsVoyageurs_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles rgDetailsVoyageurs.ItemDataBound
        Dim ages As List(Of Int16) = Components.AgeVoyageurs

        If (TypeOf (e.Item) Is GridDataItem) Then

            Dim item As GridDataItem = DirectCast(e.Item, GridDataItem)

            'Création des contrôles à insérer
            Dim rtxtPrenom As New RadTextBox
            rtxtPrenom.Width = 200
            rtxtPrenom.Skin = "Windows7"
            rtxtPrenom.MaxLength = 50
            rtxtPrenom.ShowButton = False
            rtxtPrenom.ClientEvents.OnValueChanged = "RefreshPreneurs"
            rtxtPrenom.ID = "PrenomVoyageur" + (e.Item.ItemIndex + 1).ToString()
            Dim rfvPrenom As New RequiredFieldValidator
            rfvPrenom.ErrorMessage = "Le prénom est obligatoire"
            rfvPrenom.Text = "*"
            'rfvPrenom.
            rfvPrenom.ControlToValidate = "PrenomVoyageur" + (e.Item.ItemIndex + 1).ToString()

            Dim rtxtNom As New RadTextBox
            rtxtNom.Width = 350
            rtxtNom.Skin = "Windows7"
            rtxtNom.MaxLength = 100
            rtxtNom.ShowButton = False
            rtxtNom.ID = "NomVoyageur" + (e.Item.ItemIndex + 1).ToString()
            Dim rfvNom As New RequiredFieldValidator
            rfvNom.ErrorMessage = "Le nom est obligatoire"
            rfvNom.Text = "*"
            rfvNom.ControlToValidate = "NomVoyageur" + (e.Item.ItemIndex + 1).ToString()

            'Date de naissance
            ''Jour
            Dim dateNaissanceJour As New RadNumericTextBox
            dateNaissanceJour.Width = 30
            dateNaissanceJour.MinValue = 1
            dateNaissanceJour.MaxValue = 31
            dateNaissanceJour.MaxLength = 3
            dateNaissanceJour.NumberFormat.DecimalDigits = 0
            dateNaissanceJour.NumberFormat.GroupSeparator = ""
            dateNaissanceJour.AllowOutOfRangeAutoCorrect = True
            dateNaissanceJour.ID = "DateNaissanceJourVoy" + (e.Item.ItemIndex + 1).ToString()
            Dim rfvDOBJ As New RequiredFieldValidator
            rfvDOBJ.ErrorMessage = "Le jour de naissance est obligatoire"
            rfvDOBJ.Text = "*"
            rfvDOBJ.ControlToValidate = "DateNaissanceJourVoy" + (e.Item.ItemIndex + 1).ToString()

            ''Mois
            Dim dateNaissanceMois As New Telerik.Web.UI.RadComboBox
            dateNaissanceMois.Width = 100

            Dim mois As New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Janvier"
            mois.Value = "01"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Février"
            mois.Value = "02"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Mars"
            mois.Value = "03"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Avril"
            mois.Value = "04"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Mai"
            mois.Value = "05"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Juin"
            mois.Value = "06"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Juillet"
            mois.Value = "07"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Août"
            mois.Value = "08"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Septembre"
            mois.Value = "09"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Octobre"
            mois.Value = "10"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Novembre"
            mois.Value = "11"
            dateNaissanceMois.Items.Add(mois)

            mois = New Telerik.Web.UI.RadComboBoxItem
            mois.Text = "Décembre"
            mois.Value = "12"
            dateNaissanceMois.Items.Add(mois)

            dateNaissanceMois.ID = "DateNaissanceMoisVoy" + (e.Item.ItemIndex + 1).ToString()


            ''Année
            Dim dateNaissanceAnnee As New Telerik.Web.UI.RadNumericTextBox
            dateNaissanceAnnee.Value = (Date.Today.Year - (ages((e.Item.ItemIndex))))
            dateNaissanceAnnee.Width = 60
            dateNaissanceAnnee.MinValue = Date.Today.Year - 120
            dateNaissanceAnnee.MaxValue = Date.Today.Year + 120
            dateNaissanceAnnee.MaxLength = 4
            dateNaissanceAnnee.NumberFormat.DecimalDigits = 0
            dateNaissanceAnnee.NumberFormat.GroupSeparator = ""
            dateNaissanceAnnee.AllowOutOfRangeAutoCorrect = True
            dateNaissanceAnnee.ID = "DateNaissanceAnVoy" + (e.Item.ItemIndex + 1).ToString()
            Dim rfvDOBA As New RequiredFieldValidator
            rfvDOBA.ErrorMessage = "Le jour de naissance est obligatoire"
            rfvDOBA.Text = "*"
            rfvDOBA.ControlToValidate = "DateNaissanceAnVoy" + (e.Item.ItemIndex + 1).ToString()

            'A charge
            Dim chkACharge As New CheckBox
            chkACharge.ID = "AChargeVoy" + (e.Item.ItemIndex + 1).ToString()
            chkACharge.Visible = True

            'Ajout à la grille
            item("Prenom").Controls.Add(rtxtPrenom)
            item("Prenom").Controls.Add(rfvPrenom)
            item("Nom").Controls.Add(rtxtNom)
            item("Nom").Controls.Add(rfvNom)
            item("Date de naissance").Controls.Add(dateNaissanceJour)
            item("Date de naissance").Controls.Add(rfvDOBJ)
            item("Date de naissance").Controls.Add(dateNaissanceMois)
            item("Date de naissance").Controls.Add(dateNaissanceAnnee)
            item("Date de naissance").Controls.Add(rfvDOBA)
            item("A Charge").Controls.Add(chkACharge)

        End If
    End Sub

And I've put the Javascript snippet in the body of the aspx page:
ASPX:

...
</MasterTableView>
</telerik:RadGrid>
</telerik:RadAjaxPanel>
<script language="javascript" type="text/javascript">

    function RefreshPreneurs() {
        var index = $find("rgDetailsVoyageurs")._editIndexes;
        alert(index);
    }
    </script>

            </td>
        </tr>
        <tr>
            <td>
                   <telerik:RadAjaxPanel ID="rapValidation" runat="server" Width="1000px">
...

Hope this will help you see what is wrong with my code. -lol-
Thanks for all the help

Sam

[Sammy78]

Ok, I changed the javascript to this:
ASPX:

...
</telerik:RadAjaxPanel>
                <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

    function RefreshPreneurs() {
        var index = document.getElementById('<%=rgDetailsVoyageurs.ClientID %>')._editIndexes;
        alert(index);
    }
    </script>
                </telerik:RadCodeBlock>
            </td>
        </tr>
        <tr>
            <td>
                   <telerik:RadAjaxPanel ID="rapValidation" runat="server" Width="1000px">
...

But the alert gives me an "undefined".

[Sammy78]

And when I change the fonction to:
Javascript:

function RefreshPreneurs() {
        var index = $find("<%=rgDetailsVoyageurs.ClientID %>")._editIndexes;
        alert(index);
    }

then messageBox is empty

[Princy]

Hello Sam,

The above code will work if the RadTextBox is inside EditItemTemplate. Since your RadTextBox is in ItemTemplate, try the following code snippet to get the row index.

Java Script:

<script type="text/javascript">
    function ValueChanged(sender,args)
    {
         var cell = sender.get_element().parentNode.parentNode;
         alert(cell.parentNode.rowIndex);
    }
</script>

Hope this helps,
Princy.

[Sammy78]

Hi Princy,

The code works great! I'll finally be able to finish that function!!
Thanks a lot
Sam

[Sammy78]

Hi Princy,

The code works great! I'll finally be able to finish that function!!
Thanks a lot
Sam

P.S.: Forget the previous post, there was a syntaxe error in my code