I have a boolean value in a datatable that i bind to a datagrid from the codebehind. But instead of a checkbox the webDataGrid displays "true" or "false" and that column is editable like a string value.
Here is some code that i'm using (_sestevalniDT is a DataTable and SestevalniStevec is a WebDataGrid):
_sestevalniDT = new DataTable();
_sestevalniDT.Columns.Add(new DataColumn("Naziv", typeof(string)));
_sestevalniDT.Columns.Add(new DataColumn("Popravek", typeof(bool)));
...SestevalniStevec.DataSource = _sestevalniDT;
SestevalniStevec.DataBind();
and this is from my aspx:
<ig:WebDataGrid ID="SestevalniStevec" runat="server" StyleSetName="Appletini" Width="640" Height="480" DataKeyFields="Naziv"> <Behaviors> <ig:ColumnResizing Enabled="true"> <ColumnSettings> <ig:ColumnResizeSetting EnableResize="true" /> </ColumnSettings> </ig:ColumnResizing> <ig:EditingCore> <Behaviors> <ig:CellEditing Enabled="true" EditModeActions-MouseClick="Single"> <CellEditingClientEvents EnteringEditMode="svoEnteringEditMode" /> </ig:CellEditing> </Behaviors> </ig:EditingCore> </Behaviors> </ig:WebDataGrid>
What should i add in order for the bool value to display as a checkbox?
Thanks for your help.
More specifically what i think i'm looking for is a way to use a column template like this: http://samples.infragistics.com/2010.1/WebFeatureBrowser/contents.aspx?showCode=true&t=WebDataGrid/Templates/WebDataGrid_TemplatesHeaderFooter.aspx~srcview.aspx?path=~srcview.aspx?path=WebDataGrid/Templates/WebDataGrid_TemplatesHeaderFooter.src
But i need to assign it to the appropriate column from the code-behind, not from aspx, and i don't know how to do this. I can't even access any datagrid columns from the codebehind.
I found an article about WebDataGrid editor providers and i thought i could make one with a checkbox. But this seems to be quite hard as well, this is the code i have so far:
namespace wCSRE.BLL{ public class CheckBoxProvider : EditorProvider<CheckBox> { protected override bool CanEditType(Type t) { string name = t.FullName; if (t.Name == "Boolean" || t.Name == "bool") return true; return false; } protected override string ClientObjectClassName { get { return "Infragistics.Web.UI.EditorProvider"; //return "wCSRE.BLL.CheckBoxProvider"; } } }}
But when i try to use it, i get "Specified method is not supported" from javascript.
Anyway i think an editorprovider can't be the right solution for me either, common sense suggests that there MUST be a way to turn on checkboxes for boolean values without this many complications. In fact it is strange that the WebDataGrid doesn't display the boolean value as a checkbox in the first place.
admin: don't mark this one as an answer either please
Now i have transferred some of the functionality from the code-behind to the aspx, now i have a list of columns like this:
<ig:BoundDataField Key="Naziv"><Header Text="Naziv" /></ig:BoundDataField><ig:BoundDataField key="Odčitek"><Header Text="Odčitek" /></ig:BoundDataField> <ig:TemplateDataField Key="Popravek" Width="50px"> <HeaderTemplate>Popravek</HeaderTemplate> <ItemTemplate> <div style="text-align: center;"> <asp:CheckBox runat="server"/> </ItemTemplate> </ig:TemplateDataField><ig:BoundDataField Key="Količina"><Header Text="Količina" /></ig:BoundDataField><ig:BoundDataField key="Preračun"><Header Text="Preračun" /></ig:BoundDataField>
"Popravek " is the only column with a boolean value. All the other columns work properly, and Popravek shows a checkbox, but this checkbox is not linked to the actual data. Is there any way for me to bind it? Or maybe to handle the checkbox events with javascript?
I think i almost found a solution, i just need to know another detail.
I added a client-side function to the checkbox from my previous post. When the box is checked i want to update the right cell in the datagrid.
<asp:CheckBox runat="server" OnClick="boxClicked(this);"/>
Here is my javascript function:
function boxClicked(checkbox) { var cbid = checkbox.id; var cblen=cbid.length var idnum = parseInt(cbid.substring(cblen - 2, cblen)); var ssgrid = $find('<%= SestevalniStevec.ClientID %>'); var row = ssgrid.get_rows().get_row(idnum); var cell = get_cell(2); }
But when i call get_cell, i get "Microsoft JScript runtime error: Object expected", does anybody know what could be causing this? I want to get a reference to my selected cell so i can set its value to true or false. I also tried get_cellByColumnKey("Popravek") and got the same result.
EDIT: never mind, i forgot to write row.get_cell. maybe i'll get it working soon and then i'll post what i did.
Now i managed to get the checkbox to update the value in the webdatagrid, but when i click my store button the changes don't get stored in my datasource.In the image you can see that the Popravek value changes with the checkbox, but the actual value in the datasource stays the same.
Any suggestions about how i could make it work?
This is my javascript function at the moment:
function boxClicked(checkbox) { var cbid = checkbox.id; var cblen=cbid.length var idnum = parseInt(cbid.substring(cblen - 2, cblen)); var ssgrid = $find('<%= SestevalniStevec.ClientID %>'); var row = ssgrid.get_rows().get_row(idnum); var cell = row.get_cellByColumnKey("Popravek"); var element = cell.get_element(); element.firstChild.data = checkbox.checked; }
I just noticed that the RowEditingTemplate seems to be something completely different from what i need, so i'm back to trying what i described on 06-07-2010 7:10 AM.
Can somebody please help me make it work?
Did you have any luck with this? I need to do the same and I'm quite disappointed with Infragistics... It's just a simple checkbox, how could it be so hard!?!
It worked just like I needed. Thanks a lot for sharing this information, you have no idea how much you've helped me! :)
Hello!
I got a solution to my problem on Infragistics Support, it is a lot more helpful than the forum. Here are the replies i got to my questions:
Thank you for contacting Infragistics support.
In order to display the Boolean value as CheckBox you have to create template column.
By default the AutoGenerateColumns property is set to True
and the WebDataGrid is automatically creating all the columns from the datasource
<Columns>
<ig:TemplateDataField Key=" boolColumn">
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server"
Checked='<%# DataBinder.Eval(((Infragistics.Web.UI.TemplateContainer)Container).DataItem, "boolColumn") %>'>
</asp:CheckBox>
</ItemTemplate>
<Header Text="boolColumn" />
</ig:TemplateDataField>
</Columns>
Here you can find more information regarding the usage of item template in the online documentation:http://help.infragistics.com/NetAdvantage/ASPNET/2010.1/CLR3.5/?page=WebDataGrid_Using_Item_Template.html
Thank you for the update.The best option to update the data source is inside the CheckedChanged event of the CheckBox.Below there is sample code how you can do this:
protected void Page_Load(object sender, EventArgs e)
{
if (Session["data"] != null)
DataTable data = (DataTable)Session["data"];
WebDataGrid1.DataSource = data;
}
else {
DataTable table = MakeTable();
WebDataGrid1.DataSource = table;
Session["data"] = table;
protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
CheckBox chk = (CheckBox)sender;
TemplateContainer parent = (TemplateContainer)chk.Parent;
DataRowView dataItem = (DataRowView)parent.DataItem;
DataRow row = dataItem.Row;
row.SetField("bool", chk.Checked);
Session["data"] = WebDataGrid1.DataSource;