I have made a site using the original GridView of asp.net 2, and i have the trouble that inside an UpdatePanel (i'm using Microsoft Ajax) the add/update/delete operations are very slow even if i have attempted every optimization; but i have a dozen of grids inside the page, even if with a few records (and there are many editable fields)
In the online samples for WebDataGrid i'm seeing only ObjectDataSource as datasource for grids, while in my site i'm using an ADO.NET DataTable; so my questions , in order to download the Infragistic trial and try a conversion, are:
1) DataTable as source for the WebDataGrid
2) Is it possible to create a new row with clicking a button? i'm seeing only samples where the new row is already present
3) In a grid i have the first editable field as a DropDown, changing the selected index in other 2 fields i should activate 2 numeric fields (when the value of the first DropDown is "OTHER") or others 2 combos , dinamically filtered by the first dropdown SelectedValue (obviously except when the value of the first dropdown is "OTHER"); the DropDowns datasources are DataTables
4) numeric input: is it possible to avoid that the user write more digits than the expected picture: for example if i want that the user could enter only 2 integers and 2 decimals (max number allowed 99,99) is it possible to avoid that the user could write 999,999?
5) My site is using UpdatePanel and some other controls from Microsoft Ajax Toolkit: apart UpdatePanel, used exclusively for GridViews, the others controls does not have problems adding the Infragistic grid in the page? and i'm using Page Methods, will these continue to work ?
Either use:<igtxt:WebNumericEdit ID="WebNumericEdit1" runat="server" BorderStyle="None" MinValue="0" MaxValue="100" MinDecimalPlaces="Two" MaxLength="3"> <SpinButtons Display="OnRight"></SpinButtons></igtxt:WebNumericEdit>
or use JS to validate etc. on the fly.
I have tried even with WebDataGrid, that has the same behavior of UltraWebGrid:
<igtxt:WebNumericEdit ID="WebNumericEdit1" runat="server" BorderStyle="None" MinValue="0" MaxValue="100" MinDecimalPlaces="Two" MaxLength="5"> <SpinButtons Display="OnRight"></SpinButtons></igtxt:WebNumericEdit>
And it works, but with this configuration i can write for example 3 decimals (that will be rounded to 2 when the focus moves to next cell)
or i can write for example 222,5 and when i move to next cell it will be rounded to 100,00
This is acceptable , but the ideal behavior should be :
It is possibile to obtain this in some manner , with a regular expression for example ?
I'm sorry to insist , but the users would have this ....
Rumen Stankov"]Question #4 - numeric input: is it possible to avoid that the user write more digits than the expected picture: for example if i want that the user could enter only 2 integers and 2 decimals (max number allowed 99,99) is it possible to avoid that the user could write 999,999? Yes, this is possible - The WebDataGrid includes several built in editor providers that can be used to customize the editing experience - Text Editor, Date Chooser, Numeric Editor, and Slider Editor. In your case, what you need is the Numeric Editor. They are available off the EditorProviders collection directly under the WebDataGrid declaration. You can customize each of the providers using numerous properties, for example:<ig:WebDataGrid ... <EditorProviders> <ig:WebTextEditProvider ID="BasicTextProvider" /> <ig:WebNumericEditProvider ID="FreightValueProvider" DataMode="Decimal" MinDecimalPlaces="2" MinValue="0" MaxValue="100"/> <ig:WebDateChooserProvider ID="DateInputProvider" /> <ig:SliderProvider ID="QuantityValueProvider"> <EditorControl ID="EditorControl1" runat="server" MinValueAsString="0" MaxValueAsString="100" ContentAlignment="Center" ValueType="Int" Width="200px" /> </ig:SliderProvider></EditorProviders> ... </ig:WebDataGrid> After that, you simply have to map Editor IDs to the actual column in the EditingCore.CellEditing behavior, for example:<Behaviors> <ig:EditingCore> <Behaviors> <ig:CellEditing Enabled="true" > <ColumnSettings> <ig:EditingColumnSetting ColumnKey="CustomerID" ReadOnly="true" /> <ig:EditingColumnSetting EditorID="BasicTextProvider" /> <ig:EditingColumnSetting ColumnKey="OrderDate" EditorID="DateInputProvider" /> <ig:EditingColumnSetting ColumnKey="ShippedDate" EditorID="DateInputProvider" /> <ig:EditingColumnSetting ColumnKey="Freight" EditorID="FreightValueProvider" /> <ig:EditingColumnSetting ColumnKey="Quantity" EditorID="QuantityValueProvider" /> </ColumnSettings> </ig:CellEditing> </Behaviors> </ig:EditingCore> </Behaviors> and that's it.There is a great live example on how to achieve that available here
Question #4 - numeric input: is it possible to avoid that the user write more digits than the expected picture: for example if i want that the user could enter only 2 integers and 2 decimals (max number allowed 99,99) is it possible to avoid that the user could write 999,999?
Yes, this is possible - The WebDataGrid includes several built in editor providers that can be used to customize the editing experience - Text Editor, Date Chooser, Numeric Editor, and Slider Editor. In your case, what you need is the Numeric Editor. They are available off the EditorProviders collection directly under the WebDataGrid declaration. You can customize each of the providers using numerous properties, for example:
<ig:WebDataGrid ...
<EditorProviders> <ig:WebTextEditProvider ID="BasicTextProvider" /> <ig:WebNumericEditProvider ID="FreightValueProvider" DataMode="Decimal" MinDecimalPlaces="2" MinValue="0" MaxValue="100"/> <ig:WebDateChooserProvider ID="DateInputProvider" /> <ig:SliderProvider ID="QuantityValueProvider"> <EditorControl ID="EditorControl1" runat="server" MinValueAsString="0" MaxValueAsString="100" ContentAlignment="Center" ValueType="Int" Width="200px" /> </ig:SliderProvider></EditorProviders>
...
</ig:WebDataGrid>
After that, you simply have to map Editor IDs to the actual column in the EditingCore.CellEditing behavior, for example:
<Behaviors> <ig:EditingCore> <Behaviors> <ig:CellEditing Enabled="true" > <ColumnSettings> <ig:EditingColumnSetting ColumnKey="CustomerID" ReadOnly="true" /> <ig:EditingColumnSetting EditorID="BasicTextProvider" /> <ig:EditingColumnSetting ColumnKey="OrderDate" EditorID="DateInputProvider" /> <ig:EditingColumnSetting ColumnKey="ShippedDate" EditorID="DateInputProvider" /> <ig:EditingColumnSetting ColumnKey="Freight" EditorID="FreightValueProvider" /> <ig:EditingColumnSetting ColumnKey="Quantity" EditorID="QuantityValueProvider" /> </ColumnSettings> </ig:CellEditing> </Behaviors> </ig:EditingCore> </Behaviors>
and that's it.
There is a great live example on how to achieve that available here
I am going for js being cached :)
Correction: i'm not understanding why (but i'm sure that it was not working) but now the focusing in the first editable field is working.
So my js code in AfterRowInsertHandler is correct, it works.
mistral61 said:Thank you for the help.Actually i'm trying with the UltraWebGrid, not the WebDataGrid, because there are more samples; i'm using .net 2 Now is working the adding by clicking a button , but it seems not possible to activate the cursor on the first editable field: if i start to type after clicking the "add new" button the text appear in the field, but the users tipically needs the blinking cursor ...I have tried the event AfterRowInsertHandler :in the Grid definition there is <ClientSideEvents AfterRowInsertHandler="grdStentsLAD_AfterRowInsertHandler" />and my script is function grdStentsLAD_AfterRowInsertHandler(gridName, rowId) { var oRow = igtbl_getRowById(rowId); var oCell = oRow.getCellFromKey('Type'); oCell.activate(); oCell.setSelected(true); oCell.beginEdit(); } I have verified with the debugger (i'm using Visual Studio2008) that the js code is executed, but the blinking cursor does not appear in the field (UltraGridColumn): could be that it works applying the latest service pack? (i have seen that is downloadable only by registered users, i'm using the trial evaluation)
Thank you for the help.
Actually i'm trying with the UltraWebGrid, not the WebDataGrid, because there are more samples; i'm using .net 2
Now is working the adding by clicking a button , but it seems not possible to activate the cursor on the first editable field: if i start to type after clicking the "add new" button the text appear in the field, but the users tipically needs the blinking cursor ...
I have tried the event AfterRowInsertHandler :
in the Grid definition there is
<ClientSideEvents AfterRowInsertHandler="grdStentsLAD_AfterRowInsertHandler" />
and my script is
function grdStentsLAD_AfterRowInsertHandler(gridName, rowId) { var oRow = igtbl_getRowById(rowId); var oCell = oRow.getCellFromKey('Type'); oCell.activate(); oCell.setSelected(true); oCell.beginEdit(); }
I have verified with the debugger (i'm using Visual Studio2008) that the js code is executed, but the blinking cursor does not appear in the field (UltraGridColumn): could be that it works applying the latest service pack? (i have seen that is downloadable only by registered users, i'm using the trial evaluation)
Oh, well :) Still, I am sure all that information I wrote will be useful to some developers. Could you please ask UltraWebGrid question in the respective forum located here:
http://forums.infragistics.com/forums/61.aspx
This way it will much easier for everyone to track the conversation and it increases the chance of the question to get good answer.