I have a gridview with a textbox and a dropdown On change of the dropdown to the Value P i want textbox next to it to be disabledI have tried something already but it isnt workingltscript type34textjavascript34gt function ToggleOnOffdrpusing drpusingparent parent of ddl is td next gives the next td find39select39 finds a select element in that td attr39disabled39 drpusingval

Hi RumeValidRefer below sampleHTMLltscript type34textjavascript34 src34httpajaxgoogleapiscomajaxlibsjquery191jqueryminjs34gtltscriptgtltscript type34textjavascript34gt function 34idGridView134find34iddrpusing34changefunction var row thisclosest34tr34 var value thisval if value 34P34 rowfind34idtxtpayitem34attr34Disabled34 34true34 ltscriptgtltdivgt ltaspGridView ID34GridView134 runat34server34 AutoGenerateColumns34false34gt ltColumnsgt ltaspTemplateField HeaderText34SN34gt ltItemTemplategt ltspan id34indxid34 class34indxno34 style34textalign center34gt lt ContainerDataItemIndex1

Disable TextBox inside ASP.Net GridView based on DropDownList selection using jQuery

RumeVali...

SOLVED CLOSED ACTIVE ANSWERED
User: RumeValid
Posted: on Apr 01, 2019 09:34 AM
Forum: Data Controls
Answer: 1
Views: 4232
Sample Code: Download

I have a gridview with a textbox and a dropdown. On change of the dropdown to the Value P i want textbox next to it to be disabled.

I have tried something already but it isn't working.

<script type="text/javascript">
    function ToggleOnOff(drpusing) {
        $(drpusing).parent() // parent of ddl is td
                   .next() // gives the next td 
                   .find('select') // finds a select element in that td
                   .attr('disabled', (drpusing.value == "P") ? 'disabled' : ''); //enable-disable
    }
</script>

        <div class="frmnew_line" style="margin-top: 5px; width: 1250px; padding-bottom: 1em">
            <div id="divgrid">              
                <asp:GridView ID="grid_pfbdy" ClientIDMode="Static" runat="server" AutoGenerateColumns="false"
                    EmptyDataText="No Record" ViewStateMode="Enabled" ShowHeader="true" EnableViewState="true"
                    CssClass="frmgridview" Font-Size="12px"
                    HeaderStyle-CssClass="frmheader_gridview"
                    AlternatingRowStyle-BackColor="DarkGray" Width="612px" CellPadding="4" ForeColor="#333333" GridLines="Both">
                    <Columns>
                        <asp:TemplateField HeaderText="S/N">
                            <ItemTemplate>
                                <span id="indxid" class="indxno" style="text-align: center"><%# Container.DataItemIndex+1 %> </span>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Service Year">
                            <ItemTemplate>
                                <asp:TextBox runat="server" ID="txtservyear" ClientIDMode="Static" CssClass="txtservyear" Width="100px"></asp:TextBox>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Using">
                            <ItemTemplate>
                                <asp:DropDownList runat="server" ID="drpusing" ClientIDMode="Static" CssClass="drpusing" onchange="ToggleOnOff(this)">
                                    <asp:ListItem Text="-- Select--"></asp:ListItem>
                                    <asp:ListItem Text="Value" Value="V"></asp:ListItem>
                                    <asp:ListItem Text="Percentage" Value="P"></asp:ListItem>
                                </asp:DropDownList>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Payitem to use to derive value">
                            <ItemTemplate>
                                <asp:TextBox runat="server" ID="txtpayitem" ClientIDMode="Static" CssClass="txtpayitem"></asp:TextBox>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Amount">
                            <ItemTemplate>
                                <asp:TextBox runat="server" ID="txtamount" ClientIDMode="Static" CssClass="txtamount"></asp:TextBox>
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </div>
        </div>

pandeyis...

0 3

Reply
ANSWER
User: pandeyism
Replied: on Apr 02, 2019 12:32 AM
Report

Hi RumeValid,

Refer below sample.

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("[id*=GridView1]").find("[id*=drpusing]").change(function () {
            var row = $(this).closest("tr");
            var value = $(this).val();
            if (value == "P") {
                row.find("[id*=txtpayitem]").attr("Disabled", "true");
            }
        });
    });
</script>
<div>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
        <Columns>
            <asp:TemplateField HeaderText="S/N">
                <ItemTemplate>
                    <span id="indxid" class="indxno" style="text-align: center">
                        <%# Container.DataItemIndex+1 %>
                    </span>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:BoundField DataField="Name" HeaderText="Name" />
            <asp:TemplateField HeaderText="Using">
                <ItemTemplate>
                    <asp:DropDownList runat="server" ID="drpusing">
                        <asp:ListItem Text="-- Select--"></asp:ListItem>
                        <asp:ListItem Text="Value" Value="V"></asp:ListItem>
                        <asp:ListItem Text="Percentage" Value="P"></asp:ListItem>
                    </asp:DropDownList>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Payitem to use to derive value">
                <ItemTemplate>
                    <asp:TextBox runat="server" ID="txtpayitem"></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
</div>

Namespaces

using System.Data;

VB.Net

Imports System.Data

Code

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("Name");
        dt.Rows.Add("Mudasser Khan");
        dt.Rows.Add("John Hammod");
        dt.Rows.Add("Rober Mathew");
        this.GridView1.DataSource = dt;
        this.GridView1.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.Add("Name")
        dt.Rows.Add("Mudasser Khan")
        dt.Rows.Add("John Hammod")
        dt.Rows.Add("Rober Mathew")
        Me.GridView1.DataSource = dt
        Me.GridView1.DataBind()
    End If
End Sub

Screenshot

Disable TextBox inside ASP.Net GridView based on DropDownList selection using jQuery

Company

Explore

Follow us

Contact Us