Questions on UI for ASP.NET AJAX Forum

3 answers

134 views

RadMaskedTextBox: reformat contents after entry possible?

Greetings. I know that there are various javascript stunts available to get the kind of functionality I'm about to describe to happen, and I've had to implement some to get this functionality already. But I'm here asking if I just overlooked something in RadMaskedTextBox.

The functionality is this: Let's say I have a text box for entering SSN. What my client wants to have happen is for the box to look plain, no displayed masking of dashes or prompts when empty. He wants the cursor to always start at the leftmost character when the box is truly empty and it gets the focus.

When typing, he wants the input to be restricted to only numbers, period. But then, after the field is exited, he wants the field to magically reformat itself for display with the masking dashes. So I typed 012345678, and it looks like that while I'm in the box and typing, but on blur, it turns into 012-34-5678. Similarly if I re-entered the box it would go back to 012345678 during the edit.

Notably, the guy is asking this because of the way that he perceives RadDateInput to work, in the way that you can enter different date formats and it'll reformat it like magic on exit. I can't really blame him for not knowing this is an apples/oranges kind of a deal.

RadMaskedTextBox seems just millimeters away from this, but I can't quite get it to happen in the way the client wants. I can't get it to not show the masking dashes when it's empty or during typing, and a couple of other minor matters that to the client are a deal-breaker and I'm off in custom javascript land to solve it.

Am I just missing something? If so, that'd be great, as they're wanting this kind of functionality for phone numbers, too, where it would magically materialize (123)456-7890 out of 1234567890 in the same exact way.

Input

answered on 27 Feb 2012

2 answers

153 views

Sorting Problem for GridHyperLinkColumn

I have a radgrid with multiple cols. how do I apply sorting only on my first column that is a GridHyperLinkColumn?
I tried:

Protected Sub RadGrid1_ColumnCreated(ByVal sender As Object, ByVal e As GridColumnCreatedEventArgs)

If TypeOf e.Column Is GridHyperLinkColumn Then

Dim col As GridHyperLinkColumn = DirectCast(e.Column, GridHyperLinkColumn)

If col.UniqueName = "column1" Then

col.Allowsorting =

True ' this line gives error.' Allowsorting is not allowed for GridHyperLinkColumn

End If

End Sub

Grid

answered on 27 Feb 2012

2 answers

92 views

Autogenerated columns and persisting grid settings

Hi,
I have read and installed the demo at http://demos.telerik.com/aspnet-ajax/grid/examples/programming/savinggridsettingsonperuserbasis/defaultcs.aspx

Using the demo code it is possible to hide columns and save settings and then reload settings without the hidden columns - this works great. However, when MasterTableView.AutoGenerated is set to True to dynamically build the column set, the column settings do not seem to work.

Steps to recreate issue:
1.Install demo at http://demos.telerik.com/aspnet-ajax/grid/examples/programming/savinggridsettingsonperuserbasis/defaultcs.aspx
2. In MasterTableView change AutoGenerateColumns to true
3. Optional step: remove <Columns> section.
4. Load grid, hide any columns and save under User1.
5. Right click on column heading to display the hidden columns.
6. Select User1 and Load Settings - at this point the grid should redisplay with without the hidden columns.

As mentioned the above steps works perfectly if the autogenerated=false, therefore I am thinking there may be some issue with persisting autogenerated columns. We have a demo using this autogenerated columns in 2 days time and would therefore appreciate any help regarding this issue.

Thanks
Shipu

Grid

answered on 27 Feb 2012

2 answers

169 views

Stop page from blinking when pages change

Is is possible to have my users navigate from page to page without seeing the refresh of the page? I have a master page for my site and about 10 content pages.

Thank you

General Discussions

answered on 27 Feb 2012

1 answer

198 views

RadWindow / RadRotator / RadImage with AutoSize

Hi...

I have RadWindow containing only RadRotator with RadBinaryImage connected to underlaying database with images. My goal is to create an image gallery browser with RadWindow / RadRotator "autosize" behavior. That means RadWindow and RadRotator should have changed its width / height according to image pulled from database whenever active / shown image is changed. How can I achieve that...? I suppose to handle "autosize" behavior in OnClientShowing event but I do not know how... :-/

Thanks a lot for any advice.

Luboš

Rotator

answered on 27 Feb 2012

1 answer

116 views

How to drag a dock from one RadTab to another?

The question is in the title :)

Just know that the RadTab are created dynamically, as well as the RadDock.
Is there a way to drag a dock from one tab to another?

Thanks in advance.

Dock

answered on 27 Feb 2012

1 answer

193 views

RadCombo in RadGrid duplicate value

In my project i have data entry grid (Rad GRID) with Rad Combo box . problem I am facing is, when I press "Add Row" button,
all rad combo box value changing to first raw of the database table. please help me to sort this issue

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" Width="75px" Transparency="50">

<img alt="Loading..."

src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' style="border:0;" />

</telerik:RadAjaxLoadingPanel>

<telerik:RadGrid ID="RadGrid1" AllowMultiRowSelection="true" AllowMultiRowEdit="true"

Skin="WebBlue" runat="server" AllowAutomaticDeletes="True" AllowAutomaticInserts="True"

Width="97%" PageSize="14" AllowAutomaticUpdates="True" AllowPaging="True" AutoGenerateColumns="False"

OnNeedDataSource="RadGrid1_NeedDataSource" ShowStatusBar="true" >

<PagerStyle Mode="Slider" />

<ClientSettings>

<Selecting AllowRowSelect="true" />

</ClientSettings>

<MasterTableView CommandItemDisplay="Top" AutoGenerateColumns="False" Width="100%">

<CommandItemTemplate>

<div style="padding:10px 0px;">

<asp:Button runat="server" ID="btnAdd" Text="Add row" OnClick="btnAdd_Click" />

<asp:LinkButton ID="LinkButton1" OnClientClick="javascript:return confirm('Delete all selected Products?')"

runat="server" CommandName="DeleteSelected" CausesValidation="false" ><img style="border:0px;vertical-align:middle;" alt="" src="images/Delete.gif" /> Delete</asp:LinkButton>

</div>

</CommandItemTemplate>

<Columns>

<telerik:GridClientSelectColumn HeaderStyle-Width="40px" />

<telerik:GridTemplateColumn UniqueName="pk_productid" HeaderText="Product Code" >

<FooterTemplate>

Template footer</FooterTemplate>

<FooterStyle VerticalAlign="Middle" HorizontalAlign="Center" />

<ItemTemplate>

<telerik:RadComboBox runat="server" ID="RadComboBox1" AutoPostBack="true" DataSourceID="sqlproduct"

MarkFirstMatch="true" EnableLoadOnDemand="True" DataTextField="pk_productid"

OnItemsRequested="RadComboBox1_ItemsRequested" OnClientItemsRequested="UpdateItemCountField"

OnDataBound="RadComboBox1_DataBound" OnItemDataBound="RadComboBox1_ItemDataBound"

HighlightTemplatedItems="true" Height="140px" Width="220px" DropDownWidth="420px"

OnSelectedIndexChanged="OnSelectedIndexChangedHandler" >

<HeaderTemplate>

<ul>

<li class="col1">Product Code</li>

<li class="col2">Description</li>

</ul>

</HeaderTemplate>

<ItemTemplate>

<ul>

<li class="col1">

<%#DataBinder.Eval(Container.DataItem, "pk_productid")%>

</li>

<li class="col2">

<%#DataBinder.Eval(Container.DataItem, "descript")%></li>

</ul>

</ItemTemplate>

<FooterTemplate>

A total of

<asp:Literal runat="server" ID="RadComboItemsCount" />

items

</FooterTemplate>

</telerik:RadComboBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText="Quantity" SortExpression="prQty" UniqueName="prqty"

EditFormColumnIndex="1">

<HeaderStyle Width="80px" />

<ItemTemplate>

<asp:TextBox runat="server" ID="txtprqty" Text='<%# Bind("prQty", "{0:#.##}") %>'></asp:TextBox>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid><br />

</div>

<asp:SqlDataSource ID="sqlds2" runat="server" ConnectionString="<%$ ConnectionStrings:conDB %>"

SelectCommand="SELECT fk_productID,prqty from tblPurchaserequest where docnum=0">

</asp:SqlDataSource>

<asp:SqlDataSource ID="sqlProduct" runat="server" ConnectionString="<%$ ConnectionStrings:conDB %>"

SelectCommand="SELECT TOP 5 pk_productID,descript from tblProduct">

</asp:SqlDataSource>

<script type="text/javascript">

function UpdateItemCountField(sender, args) {

//set the footer text

sender.get_dropDownElement().lastChild.innerHTML = "A total of " + sender.get_items().get_count() + " items";

}

</script>

Protected Sub RadComboBox1_DataBound(ByVal sender As Object, ByVal e As EventArgs)

'set the initial footer label

CType(cmbsite.Footer.FindControl("RadComboItemsCount"), Literal).Text = Convert.ToString(cmbsite.Items.Count)

End Sub

Protected Sub RadComboBox1_ItemsRequested(ByVal sender As Object, ByVal e As RadComboBoxItemsRequestedEventArgs)

Dim sql As String = "SELECT * from tblProduct WHERE pk_productID LIKE '%" + e.Text + "%' or descript LIKE '%" + e.Text + "%'"

sqlProduct.SelectCommand = sql

Dim comboBox As RadComboBox = DirectCast(sender, RadComboBox)

comboBox.DataBind()

End Sub

Protected Sub RadComboBox1_ItemDataBound(ByVal sender As Object, ByVal e As RadComboBoxItemEventArgs)

e.Item.Text = (DirectCast(e.Item.DataItem, DataRowView))("pk_productID").ToString()

e.Item.Value = (DirectCast(e.Item.DataItem, DataRowView))("descript").ToString()

End Sub

Protected Sub OnSelectedIndexChangedHandler(ByVal sender As Object, ByVal e As RadComboBoxSelectedIndexChangedEventArgs)

Session("pk_productid") = e.Value

End Sub

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

'Bind the grid to the source

RadGrid1.DataSource = GetData

If IsPostBack Then

ViewState("dt") = dt

dt = CType(ViewState("dt"), DataTable)

RadGrid1.DataSource = dt

End If

End Sub

Protected Property GetData() As DataTable

Get

If ViewState("dt") Is Nothing Then

dt.Columns.Add("pk_productid", GetType(String))

dt.Columns.Add("prqty", GetType(Int32))

dt.Rows.Add("-", 0)

ViewState("dt") = dt

Else

dt = DirectCast(ViewState("dt"), DataTable)

End If

Return dt

End Get

Set(ByVal value As DataTable)

'Add the source to viewstate

ViewState("dt") = value

End Set

End Property

Protected Sub btnAdd_Click(ByVal sender As Object, ByVal e As EventArgs)

dt = CType(ViewState("dt"), DataTable)

For Each dataItem As GridDataItem In RadGrid1.Items

dt.Rows(dataItem.ItemIndex)("pk_productid") = CType(dataItem("pk_productid").FindControl("RadComboBox1"), RadComboBox).SelectedItem

dt.Rows(dataItem.ItemIndex)("prqty") = CType(dataItem("prqty").FindControl("txtprqty"), TextBox).Text

Next

ViewState("dt") = AddRow(dt)

RadGrid1.Rebind()

End Sub

Private Function AddRow(ByVal dt As DataTable) As DataTable

Dim dr As DataRow = dt.NewRow

dr(0) = "-"

dr(1) = 0

dt.Rows.Add(dr)

Return dt

End Function

ComboBox

answered on 27 Feb 2012

1 answer

108 views

RadGrid inside RadWindow having issues in grid sorting

In my aspx page I have a RadPageView which contains RadWindow and the RadGrid is inside the RadWindow. (ie. RadMultiPage -> RadPageView -> RadWindow -> RadGrid).

<telerik:RadWindow EnableShadow="true" ShowContentDuringLoad="false" runat="server"

ReloadOnShow="true" Title="Standard Text: Add Observation." OpenerElementID="lnkObservationsText"

Behaviors="None" VisibleStatusbar="false" EnableViewState="true" ID="rdWndObservationText"

Skin="Web20" Modal="true" Width="600">

<ContentTemplate>

<div class="RadModalMainDiv">

<div>

<p>

Help text to go here....</p>

</div>

<div class="divStandardTextButtonList">

<asp:Button ID="btnObservationsTextSelect" runat="server" Text="Select" CssClass="btnStandardText"

OnClientClick="return ObservationStandardText_Confirm()" />

<asp:Button ID="btnObservationsTextCancel" runat="server" Text="Cancel" CssClass="btnStandardText" />

</div>

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

<div>

<telerik:RadGrid ID="radGdObservationsText" runat="server" AllowPaging="True" AllowSorting="True"

AutoGenerateColumns="False" GridLines="None" PageSize="10" Width="100%">

<MasterTableView CommandItemDisplay="None" Name="ParentGrid">

<Columns>

<telerik:GridClientSelectColumn UniqueName="ClientSelectColumn">

</telerik:GridClientSelectColumn>

<telerik:GridBoundColumn DataField="description" HeaderText="Observation Description"

Visible="true">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

<PagerStyle Mode="NextPrevAndNumeric" />

<ClientSettings>

<Selecting AllowRowSelect="True" />

<ClientEvents OnRowSelected="SetObservationStandardText" />

</ClientSettings>

</telerik:RadGrid>

</div>

</asp:Panel>

</div>

</ContentTemplate>

</telerik:RadWindow>

When I try to sort the grid clicking on the header, the page refreshes and the RadWindow disappears. Sorting happens coz when i reopens the RadGrid the rows appea sorted. I need the RadGrid to be sroted and remain in the same state. Thanks for all helps in prior.

Grid

answered on 27 Feb 2012

6 answers

256 views

RadGrid EditTemplate controls access

Hello

I want to access a control which is in the EditTemplate, when the grid is in edit mode. The control would become visible or not
when user chooses an option from a RadioButtonList(possible when grid in edit mode only), and the only ideea I had was to treat the OnSelectedIndexChanged of the RadioButtonList, and then set the Visible property of some control:

protected void PollDistribPointsTypeOptions_SelectedIndexChanged(object sender, EventArgs e)

{

RadioButtonList rbl = sender as RadioButtonList;

if(rbl.SelectedValue == "0" || rbl.SelectedValue=="2")

(RadGrid1.EditItems[0] as GridEditableItem)["Poll_DistribPointsType"].Controls[3].Visible = false;

}

Problem is I only get the controls of the ItemTemplate, not the EditTemplate, where the desired controll exists :(
Is there a workaround for this?

Thx a lot.

Grid

answered on 27 Feb 2012

4 answers

151 views

RadAjaxManger Hide AjaxLoadingPanel for certain UpdatedControls

hi i update 2 RadGrid and 1 panel while RadTree AjaxRequest
i dun want to show the AjaxLoadingPanel showing on Panel control cs the Panel height is 30px oni
is there away to hide ajaxLoadingPanel for certaincontrol

Ajax

answered on 27 Feb 2012