This is a migrated thread and some comments may be shown as answers.

Can't checkbox checked and visible false in the radgrid on client side.

7 Answers 404 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

Nagendra asked on 04 Jun 2011, 08:29 AM

radgrid.png

Hi All,

     I have one radgrid in that i have checkboxes,raddatepicker and radnumerictextbox.

     Attached is the screenshot of my radgrid. 

    When i select raddatepicker i need to fill Percent complete radnumerictextbox with 100,completed checkbox checked

    and 99% complete checkbox uncheck and visible false on client side only.



 aspx page

 -----------------

<

telerik:RadGrid ID="RadGrid1" Skin="WebBlue" runat="server" AllowFilteringByColumn="true"

AutoGenerateColumns="false" ShowStatusBar="True" GridLines="None"

AllowPaging="true" PageSize="20" AllowSorting="True" onitemdatabound="RadGrid1_ItemDataBound">

<MasterTableView GroupLoadMode="Client">

<Columns>

<telerik:GridTemplateColumn UniqueName="Complete" HeaderText="Completed" AllowFiltering="false">

<ItemTemplate>

<asp:Panel ID="Panel1" runat="server" Width="2px">

<asp:CheckBox ID="chkComplete" runat="server"/>

</asp:Panel>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="gridActFinish" HeaderText="Actual Finish" AllowFiltering="false">

<ItemTemplate>

<telerik:RadDatePicker ID="actfinish" runat="server" Width="100px" MaxDate='<%# Convert.ToDateTime(Eval("early_start_display")).ToString("dd/MMM/yyyy") %>'

Calendar-ShowOtherMonthsDays="false" Calendar-ShowRowHeaders="false" DbSelectedDate='<%# Bind("actual_finish") %>' DateInput-DateFormat="MM/dd/yyyy">

<ClientEvents OnDateSelected ="actfinish_OnDateSelected" >

</ClientEvents>

</telerik:RadDatePicker>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="perComplete" HeaderText="99% Complete" AllowFiltering="false">

<ItemTemplate>

<asp:Panel ID="Panel2" runat="server">

<asp:CheckBox ID="Chkbox" runat="server"/>

</asp:Panel>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="perComplete" HeaderText="Percent Complete" AllowFiltering="false">

<ItemTemplate>

<telerik:radnumerictextbox id="pct" runat="server"

text='<%#Eval("pct") %>' minvalue="0" maxvalue="100" width="50px" FocusedStyle-BackColor="Yellow" NumberFormat-DecimalDigits="0">

<numberformat allowrounding="true" decimaldigits="4"/>

</telerik:radnumerictextbox>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid

>



  javascript

  --------------------------

  function actfinish_OnDateSelected(sender, args) {



               var rdgrid = $find("<%=RadGrid1.ClientID %>");

               var cell = sender.get_element().parentNode.parentNode;

               var index = cell.parentNode.rowIndex;

               var MasterTable = rdgrid.get_masterTableView();

               var row = MasterTable.get_dataItems()[index - 3]; //getting row

               var tbxAdopted = row.findControl("pct").set_value(100); //getting value of TextBox 'tbxAdopted'

               var checkbox = row.findControl("chkComplete");

               checkbox.checked = true;

           }

 in this action i am successfully filling value 100 in radnumerictextbox but i can't check the checkbox.



Thanks in advance, Please help me this senario on client side only.



Thanks,

Nagendra.

7 Answers, 1 is accepted

answered on 06 Jun 2011, 02:20 PM

Hello Nagendra,

Try using findElement() instead of findControl().

Javascript:

function actfinish_OnDateSelected(sender, args)

{

var rdgrid = $find("<%=RadGrid1.ClientID %>");

var cell = sender.get_element().parentNode.parentNode;

var index = cell.parentNode.rowIndex;

var MasterTable = rdgrid.get_masterTableView();

var row = MasterTable.get_dataItems()[index - 3]; //getting row

var checkbox = row.findElement("chkComplete");

checkbox.checked = true;

}

Thanks,
Princy.

answered on 06 Jun 2011, 03:36 PM

radgrid-Actions.png

Thanks Princy.... It's working great.

But in my senario when i am selecting Actual Finish raddatepicker of radtreeview Lot2, Percent Complete filled with 100 and Completed checkbox checked in the below row. In the above part its working fine.

JavaScript

------------------------

function actfinish_OnDateSelected(sender, args) {

var rdgrid = $find("<%=RadGrid1.ClientID %>");

var cell = sender.get_element().parentNode.parentNode;

var index = cell.parentNode.rowIndex;

var MasterTable = rdgrid.get_masterTableView();

var row = MasterTable.get_dataItems()[index - 3]; //getting row

var checkbox = row.findElement("chkComplete");

checkbox.checked = true;

var tbxAdopted = row.findControl("pct").set_value(100);

var checperComp = row.findElement("Chkbox");

checperComp.checked = false;

checperComp.style.display = 'none';

}

i think my problem in row 'index'.

Please give me the solution for this issue.

Thanks,

Nagendra.

answered on 07 Jun 2011, 06:12 AM

Hello Nagendra,

One suggestion is to attach the event form server and pass the ItemIndex from there. Here is the sample code.
C#:

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem item = (GridDataItem)e.Item;

RadDatePicker dtPkr = (RadDatePicker)item.FindControl("actfinish");

dtPkr.ClientEvents.OnDateSelected = "function(sender,args){OnDateselected('"+e.Item.ItemIndex+"');}";

}

Javascript:

function OnDateselected(index)

{

var rdgrid = $find("<%=RadGrid1.ClientID %>");

var MasterTable = rdgrid.get_masterTableView();

var row = MasterTable.get_dataItems()[index];

var checkbox = row.findElement("chkComplete");

checkbox.checked = true;

}

Thanks,
Shinu.