Questions on UI for ASP.NET AJAX Forum

0 answers

86 views

I have two rad-wizards and a text box in each wizard, i want to set the same value(from db) for two text-boxes on clicking of button. I know how to set for one at a time. Can someone help me to achieve this.

Markup:

<telerik:RadWizardStep Title="Step Properties" runat="server">

<table style="width:100%">

<tr>

<td style="width: 35%;" class="td_label" valign="top">

<telerik:RadLabel runat="server" RenderMode="Lightweight" ID="RadLabel1" Text="Sln Form:" CssClass="LabelStyle">

</telerik:RadLabel>

</td>

<td class="noWrap">

<telerik:RadTextBox runat="server" RenderMode="Lightweight" ID="slnForm" Enabled="false" CssClass="TextBoxMandatoryStyle">

</telerik:RadTextBox>

</td>

</tr>

</table>

</telerik:RadWizardStep>

<telerik:RadWizardStep Title="Form" runat="server" ID="rformWizard">

<table style="width: 100%">

<tr>

<td style="width: 35%;" class="td_label" valign="top">

<telerik:RadLabel runat="server" RenderMode="Lightweight" ID="SlnLabel" Text="SLN Form:" CssClass="LabelStyle">

</telerik:RadLabel>

</td>

<td class="noWrap">

<telerik:RadTextBox RenderMode="Lightweight" ID="slntxt" Enabled="false" runat="server" CssClass="TextBoxMandatoryStyle">

</telerik:RadTextBox>

</td>

</tr>

<telerik:RadWizardStep>

Wizard

asked on 22 Nov 2018

3 answers

424 views

Extract the new RadGrid values in the UpdateCommand event

Hi, I need to extract the new values from the GridDateTimeColumn to validate that one date is not greater than or less than another as needed. Do this but only extract the previous values in the edited items.

<MasterTableView DataSourceID="sdsControlGranel" AutoGenerateColumns="False" CommandItemDisplay="Top" EditMode="Batch">

<CommandItemSettings SaveChangesText="Guardar cambios" CancelChangesText="Cancelar cambios" ShowExportToExcelButton="True" ShowAddNewRecordButton="false"></CommandItemSettings>

<BatchEditingSettings EditType="Row" />

<Columns>

<telerik:GridDateTimeColumn DataField="FcAsignacion" HeaderText="Fecha Asignación" SortExpression="FcAsignacion" UniqueName="FcAsignacion" DataType="System.DateTime" PickerType="DateTimePicker" FilterControlAltText="Filter FcAsignacion column" CurrentFilterFunction="Contains">

</telerik:GridDateTimeColumn>

<telerik:GridDateTimeColumn DataField="FcInicioOperacion" HeaderText="Fecha Inicio" SortExpression="FcInicioOperacion" UniqueName="FcInicioOperacion" DataType="System.DateTime" PickerType="DateTimePicker" FilterControlAltText="Filter FcInicioOperacion column" CurrentFilterFunction="Contains">

</telerik:GridDateTimeColumn>

<telerik:GridDateTimeColumn DataField="FcFinalOperacion" HeaderText="Fecha Final" SortExpression="FcFinalOperacion" UniqueName="FcFinalOperacion" DataType="System.DateTime" PickerType="DateTimePicker" FilterControlAltText="Filter FcFinalOperacion column" CurrentFilterFunction="Contains">

</telerik:GridDateTimeColumn>

</Columns>

</MasterTableView>

protected void rgControlGranel_UpdateCommand(object sender, GridCommandEventArgs e)

{

GridEditableItem editItem = e.Item as GridEditableItem;

Hashtable newValues = new Hashtable();

e.Item.OwnerTableView.ExtractValuesFromItem(newValues, editItem);

DateTime fcAsignacion = Convert.ToDateTime(newValues["FcAsignacion"].ToString());

DateTime fcInicio = Convert.ToDateTime(newValues["FcInicioOperacion"].ToString());

if (DateTime.Compare(fcAsignacion, fcInicio) > 0)

{

e.Canceled = true;

this.TextoMensaje("La fecha de asignación no puede ser mayor a la de inicio", 3);

ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "alertMessage", "MostrarMensaje();", true);

}

Grid

answered on 22 Nov 2018

2 answers

215 views

Dynamic height for RadScheduler form

Thought this should be easy, but I think I am missing something very fundamental here.

Requirement: I have added RadScheduler to the content page and want to set the height to 100% of DIV - DIV's height is fluid - fills entire space between content header and content footer.

Issues

If I set Overflow='Expanded' it expands BEYOND the page but with no scroll - so I can only see between 00:00 to 15:00! Rest is hidden
If I set overflow ='Auto' - same results as above
If I set Overflow='Scroll' and set the height in % - The height setting in % does seem to do any good and height is more than the containing div
If I set overflow='Scroll' and set height in px - it is not fluid as I wouldn't know the px height in all over config or when window is resized
If I set Overflow='Expanded' and let the overflow of container div to auto then the Radscheduler headers (date and times of event) is no longer fixed
If I set the overflow = 'Scroll' and set the height using jQUERY when page load and window resizes; all is fine until I move to the next week/month then height is set to 400px (default)

What am I missing here?

Thanks in advance

Scheduler

answered on 22 Nov 2018

9 answers

870 views

Filter GridDateTimeColumn with a time of MM/dd/yyyy hh:mm:ss

I have a GridDateTimeColumn on my radgrid that is not filtering correctly. When I change the date to be less than a certain date it is not filtering the data correctly. I am assuming it has something to do with the date not being formatted as MM/dd/yyyy and having a time stamp. Here is my code ...

Any help here?

Trevor

telerik:GridDateTimeColumn HeaderText="Creation Date" DataFormatString="{0:MM/dd/yyyy hh:mm:ss}" SortExpression="Created" ItemStyle-Wrap="false" UniqueName="Created" DataField="whenCreated" FilterListOptions="VaryByDataType" FilterImageUrl="~/images/filter_icon.gif" FilterControlWidth="100px" />

Grid

answered on 22 Nov 2018

9 answers

1.3K+ views

Telerik RadGrid (using Batch Edit) Hide / Disable Column Based on Another Column's Value

I'm trying to get RadGrid to conditionally hide or disable a field when it is in edit mode based on the value of another field.

I have been able to get this to work when the grid displays the list of items, but once the grid enters edit mode, the columns display ...

I am using OnItemDataBound to successfully conditionally display during the initial load, but setting the items when the user clicks a row to get it into batch mode is not working.

I'm also trying to set the tab order when I go into edit mode, for some reason, the grid throws the cursor to the 2nd column ...

Note: PValue and CValue and in GridTemplateColumns, as is CardStatus.

public void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)

{

foreach (GridDataItem item in RadGrid1.Items)

{

string BoundColumnValue = item["CardStatus"].Text; // accessing GridBoundColumn value using ColumnUniqueName

string BoundColumnValue2 = item["CValue"].Text;

TextBox txtbx = (TextBox)item.FindControl("CardStatus");

Label numlb = (Label)item.FindControl("CardValue");

if (txtbx.Text.Equals("True"))

{

txtbx.ForeColor = Color.Red;

numlb.Enabled = false;

numlb.BackColor = Color.Yellow;

numlb.ForeColor = Color.Red;

//Just testing to see if it would evaluate

}

else

{

txtbx.ForeColor = Color.Beige;

}

//string TemplateColumnValue = lb.Text;// accessing Label Text.

}

foreach (GridEditableItem item in RadGrid1.EditItems)

{

string BoundColumnValue = item["CardStatus"].Text; // accessing GridBoundColumn value using ColumnUniqueName

string BoundColumnValue2 = item["CValue"].Text;

TextBox txtbx = (TextBox)item.FindControl("CardStatus");

if (txtbx.Text.Equals("True"))

{

txtbx.ForeColor = Color.Red;

//numTxt.BackColor = Color.Yellow;

//numTxt.ForeColor = Color.Red;

}

else

{

txtbx.ForeColor = Color.Beige;

}

I just need to be able to selectively prevent data entry in a column

The ASPX source is below:

<telerik:GridTemplateColumn ColumnEditorID="CValue" DataField="CValue" HeaderText="Card" UniqueName="CValue" ItemStyle-Width="75px" HeaderStyle-Width="75px">

<EditItemTemplate>

<telerik:RadNumericTextBox ID="CValue" Width="50px" AllowOutOfRangeAutoCorrect="false" runat="server" MaxLength="1" MaxValue="1" NumberFormat-DecimalDigits="0" Text='<%# Bind("CValue") %>'></telerik:RadNumericTextBox>

<asp:RequiredFieldValidator runat="server" ControlToValidate="CValue" ErrorMessage="<br />Required (0-1 Only)!" SetFocusOnError="true"></asp:RequiredFieldValidator>

</EditItemTemplate>

<ItemTemplate>

<asp:Label ID="CValue" Width="50px" runat="server" Text='<%# Bind("CValue") %>'></asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="DateEdited" ReadOnly="true" Visible="false" DataType="System.DateTime" FilterControlAltText="Filter DateEdited column" HeaderText="DateEdited" SortExpression="DateEdited" UniqueName="DateEdited">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn UniqueName="CardStatus" DataField="CardStatus" ItemStyle-Width="50px" HeaderStyle-Width="50px">

<ItemTemplate>

<asp:TextBox ID="CardStatus" Width="10px" runat="server" Text='<%# Bind("CardStatus") %>'></asp:TextBox>

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox ID="CardStatus" Width="10px" runat="server" Text='<%# Bind("CardStatus") %>'></asp:TextBox>

</EditItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<PagerStyle PageSizeControlType="RadComboBox"></PagerStyle>

<FilterMenu EnableImageSprites="False"></FilterMenu>

</telerik:RadGrid>

Any help / workarounds would be appreciated ... again, "just" need to prevent editing in the CValue column when the CardStatus value is true (bit field) ... using batch mode (using another solution isn't an option now).

Also, the issue with the tab order being messed up is particularly frustrating ... any hints on that one?

Thanks

Larry

(sorry , this is cross-posted elsewhere, but am a bit desperate right now).

Grid

answered on 22 Nov 2018

2 answers

281 views

Server Side Deletes

Is there any way to delete a record server side from a control outside of the RadGrid and have the grid update when the postback returns?

I have a LinkButton that handles deleting a record from the datasource and then calls the RadGrid Rebind method.

This triggers the NeedDataSource() method to fire and subsequently the RadGrid PreRender. The problem is that when the page finishes the postback, the deleted row is still visible in the grid. Any other interaction with the grid such as selecting a row or sorting, calls NeedDataSource again and the deleted row is gone.

I've verified that the data that comes back to NeedDataSource right after delete does not contain the row that was deleted.

There is a similar "Add" functionality that works fine. Meaning the row is added, data updated and Rebind called and grid shows the new row. I presume this is because the add calls a RadWindow that is still within the RadPanel that contains the RadGrid whereas the Delete button is outside of the Panel.

Here is the psuedo code of what I'm doing.

Private Sub ibtnDelete_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ibtnDelete.Click

DeleteRecord()

End Sub

Private Sub DeleteRecord()

DeleteLogicHere()

UpdateDataSourceHere()

RadGrid1.Rebind()

End Sub

Protected Sub RadGrid1_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource

RadGrid1.DataSource = FetchDataSourceHere()

End Sub

Here is a mockup of the aspx side.

<asp:LinkButton ID="ibtnDelete" CssClass="icon delete" TabIndex="10" runat="server" ToolTip="Delete Current Record"

ClientClick="return confirm('Are you sure you want to delete this record? If yes, click OK.');"></asp:LinkButton>

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" CssClass="controlsWrapper">

<telerik:RadGrid RenderMode="Lightweight" runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid1_NeedDataSource"

AllowPaging="True" AllowSorting="true" AutoGenerateColumns="false"

OnSelectedIndexChanged="RadGrid1_SelectedIndexChanged"

OnPreRender="RadGrid1_PreRender"

OnSortCommand="RadGrid1_SortCommand"

OnPageIndexChanged="RadGrid1_PageIndexChanged"

OnPageSizeChanged="RadGrid1_PageSizeChanged">

</telerik:RadGrid>

</telerik:RadAjaxPanel>

I have also tried adding ibtnDelete to the RadAjaxManager with the RadGrid, but that did not resolve anything.

Grid

answered on 22 Nov 2018

19 answers

1.3K+ views

Change radwindow titlebar height, skin/color and font

Hi,

How can i change radwindow titlebar height, skin/color and font of text? If possible provide some sample code for each.

Thanks in advance!

Fakhrul

Window

answered on 21 Nov 2018

6 answers

223 views

Trouble Registering a Custom Skin Using Assembly and External CSS files

Hello all,

I've used the Theme Builder to configure a style for our internal hub, Ive created an Assembly with Bryans builder and added it to the bin folder.

Ive looked through various tutorials on the knowledge base from Loading Skins for External assemblies to manually referencing the skins in CSS and its really starting to drive me nuts.

If anyone could please point me in the right direction it would be most appreciated.

So here goes;

In my web.config file I have the following in <appSettings>:

<add key="Telerik.Skin" value="Vulcan"/>

<add key="Telerik.EnableEmbeddedSkins" value="false"/>

<add key="Telerik.EnableEmbeddedBaseStylesheet" value="true"/>

<add key="Telerik.Web.SkinsAssembly" value="Vulcan"/>

<add key="Telerik.Web.UI.StyleSheetFolders" value="~/App_Themes/Vulcan" />

Then in my MasterPage.aspx file I have the following - note for now i'm only referencing a single control:

<telerik:RadStyleSheetManager ID="RadStyleSheetManager" runat="server">

<StyleSheets>

<telerik:StyleSheetReference Name="Vulcan.Button.Vulcan.css" Path="~/App_Themes/Vulcan/Button.Vulcan.css" Assembly="Vulcan" ></telerik:StyleSheetReference>

</StyleSheets>

</telerik:RadStyleSheetManager>

And in the child page i have:

<telerik:RadButton ID="btnRecalculate" runat="server" Text="Recalculate" OnClick="btnRecalculate_Click" RenderMode="Lightweight" Skin="Vulcan" CssClass="btnRecalculate" />

However when I view the page I get a boring unstyled standard button, which obviously I can style via CSS but that would defeat the object.

Please advise, as I'm at my wits end with the software, which has lots of cool features and functionality, but the the corporate styling is driving me crazy

Many thanks

ScriptManager and StyleSheetManager

answered on 21 Nov 2018

2 answers

164 views

Use different add button icon for child's EditCommandColumn

Would it be possible to use a different icon for the EditCommand of children? In my attached screenshot, I would like the top level to stay the same with a "+" symbol, but I would like to replace the children icons with something else.

TreeList

answered on 21 Nov 2018

3 answers

249 views

Error: Unable to get property 'Cols' of undefined or null reference

I have several grids on a page that I have enabled the Telerik Busy Indicator using the RadAjaxManager. The busy indicator works fine on all of the grid except for one. I keep getting the error "Error: Unable to get property 'Cols' of undefined or null reference" only when I export to Excel or PDF. On the "btnRun" click the indicator displays like normal, but when I export I get the error. I did see another post in which this same error displayed but I've verified that I only have one instance of the AjaxManager.

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" UpdateInitiatorPanelsOnly="true" ClientEvents-OnRequestStart="requestStart" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="cmdLoad">
                <UpdatedControls>

                    <telerik:AjaxUpdatedControl ControlID="usrStatus" />
                    <telerik:AjaxUpdatedControl ControlID="grdScoreCard" />
                    <telerik:AjaxUpdatedControl ControlID="grdEHSMonthlyStats" />
                    <telerik:AjaxUpdatedControl ControlID="grdScoreCardTitles"/>
                    <telerik:AjaxUpdatedControl ControlID="grdScoreCardFormulaEntry"/>
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="btnRun">
                <UpdatedControls>

                    <telerik:AjaxUpdatedControl ControlID="grdScoreCardDashboard" />

                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

Grid

answered on 21 Nov 2018