[Solved] Enable a textbox in a particular row inside client Template on checkbox click

[K2]

I have a telerik grid having many columns. out of many columns, in columns i am displaying data through query. and remaining columns will be disabled at that time. In disabled rows i have taken some textboxes in every row, there is a checkbox. and on the checkbox click, i want to enable the disabled textboxes: Here is my code of telerik grid:

<% Html.Telerik().Grid< ProjectAllocationSearchCriteriaViewModel>()
            .Name("EmployeeSkillsGrid")
            .ToolBar(toolbar => toolbar.Template(
                                Html.Resource("GridTitleSearchCriteria")))
                                 .DataKeys(keys =>
                                 {
                                     keys.Add(o => o.FirstName);
                                 })
                .Columns(columns =>
                {
                    columns.Bound(m => m.EmployeeID)
                       .ClientTemplate("<input type='checkbox' name='SelectedEmployee' id='SelectedEmployee' onclick='return enableGridRow(this);'/>")
                       .HeaderTemplate("<input type='checkbox' name='SelectAllEmployee' id='SelectAllEmployee' onclick='return selectAllCheckboxes(this);'/>").Width(22);
                    columns.Bound(m => m.FirstName).Title("First Name").ReadOnly(true).Width(65);
                    columns.Bound(m => m.LastName).Title("Last Name").ReadOnly(true).Width(70);
                    columns.Bound(m => m.Allocation).Title("Allocation %")
                        .ClientTemplate("<input type='textbox' name='Allocation' id='Allocation' disabled='disabled' new { style='width:55px'} value='<#=Allocation#>' />").Width(53);
                    columns.Bound(m => m.StartDate).Title("Start Date").Format("{0:d}")
                        .ClientTemplate("<input type='textbox' name='StartDate' id='StartDate' disabled='disabled' new { style='width:55px'} value='<#=StartDate#>' />")
                        .ClientTemplate(Html.Telerik().DatePicker().Name("<#=StartDate#>").ToHtmlString()).Width(74);
                    columns.Bound(m => m.EndDate).Title("End Date").Format("{0:d}")
                        .ClientTemplate("<input type='textbox' name='EndDate' id='EndDate' disabled='disabled' new { style='width:60px'} value='<#=EndDate#>' />")
                        .ClientTemplate(Html.Telerik().DatePicker().Name("<#=StartDate#>").ToHtmlString()).Width(74);
                })
                .DataBinding(databinding => databinding
                                        .Ajax()
                                        .Select("GetAllocationData", "Project", new { skill1up = 0, level1up = 0 })
                )
            .Pageable(pager => pager.PageSize(TMG.Framework.Core.WebSettings.GetGridPageSize(), new[] { 10, 25, 50, 100, 200 }).Style(GridPagerStyles.PageSizeDropDown | GridPagerStyles.NextPreviousAndNumeric))
            .Scrollable()
            .Sortable()
            .Reorderable(reorder => reorder.Columns(true))
            .Resizable(resize => resize.Columns(true))
            .Selectable()
            .Render();
        %>

I want to write a javascript/jquery for this. I have tried to write it like:

function enableGridRow(element) {
 if ($(element).is(':checked'))
       document.getElementById("Allocation").disabled = false;
    else
           document.getElementById("Allocation").disabled = true;
    return false;
}

It is working but, not for specific row which is checked/selected.plz help me?

[K2]

can anyone please help me for this......

[K2]

I resolved problem myself using jquery. The solution is:

$('[name="SelectedEmployee"]').click(function () {
    var row = $(this).closest('tr');
    if ($(this).is(':checked')) {
        // enable textbox when checkbox is checked
        row.find('#Allocation').removeAttr('disabled');
    }
    else {
        // disable textbox when checkbox is unchecked
        row.find('#Allocation').attr('disabled','disabled');
    }
});