Questions on UI for ASP.NET AJAX Forum

0 answers

88 views

TabStrip in SharePoint 2010 application page

I implemented a simple TabStrip/Wizard control as shown in this demo http://demos.telerik.com/aspnet-ajax/tabstrip/examples/applicationscenarios/wizard/defaultcs.aspx

I have one aspx with rad TabStrip and three ascx pages that feed the content of each tab. When the parent page is opened, the content of the first tab loads from the associated user control with no error. When I click next to navigate to the second tab, however, the below error occurs.

Is there something special I need to do in order for this to work in SharePoint 2010 application page?

Any help is much appreciated,

Thanks,
Ibsa

Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; GTB7.3; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MDDR; .NET4.0C; .NET4.0E; InfoPath.2)
Timestamp: <time>

Message: Sys.WebForms.PageRequestManagerServerErrorException: An unknown error occurred while processing the request on the server. The status code returned from the server was: 500
Line: 4723
Char: 21
Code: 0
URI: http://<server-name>/ScriptResource.axd?d=oxveds8lFOxv5Jc_vbLat_faNgPVzPdfeB0qCW2XezdNMjthEgXqrFCPb3GgVTLPaFSVq-wtsnpHOHDRcGQhwTt8eJiQT7-4eYDP4wCVj0dY7mlDgUNo8OpFQgy2jPFWXfv2ZbjY9M3pqKTBzAoCrGx1FQPzT-koBUUT3efDYAsF7WRA0&t=ffffffffb868b5f4

Parent aspx page:

<div class="exampleWrapper">

<telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">

</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="LoadingPanel1" Height="100%">

<div style="float:left; width:500px">

<telerik:RadTabStrip ID="RadTabStrip1" SelectedIndex="0" runat="server" MultiPageID="RadMultiPage1"

Skin="Sunset" CssClass="tabStrip">

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0" OnPageViewCreated="RadMultiPage1_PageViewCreated" CssClass="multiPage">

</telerik:RadMultiPage>

</div>

</telerik:RadAjaxPanel>

</div

>


protected void Page_Load(object sender, System.EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                AddTab("Personal Info", true);
 
                RadPageView pageView = new RadPageView();
                pageView.ID = "Personal";
                RadMultiPage1.PageViews.Add(pageView);
 
                AddTab("Education Info", false);
                AddTab("Professional Info", false);
            }
        }
 
        private void AddTab(string tabName, bool enabled)
        {
            RadTab tab = new RadTab(tabName);
            tab.Enabled = enabled;
            RadTabStrip1.Tabs.Add(tab);
        }
 
        protected void RadMultiPage1_PageViewCreated(object sender, RadMultiPageEventArgs e)
        {
            Control pageViewContents = LoadControl(e.PageView.ID + "CS.ascx");
            pageViewContents.ID = e.PageView.ID + "userControl";
 
            e.PageView.Controls.Add(pageViewContents);
        }



User Control for Tab1


<asp:Button runat="server" ID="nextButton" Text="Next" OnClick="nextButton_Click" CssClass="nextButton" />


protected void nextButton_Click(object sender, EventArgs e)
        {
            GoToNextTab();
        }
 
        private void GoToNextTab()
        {
            RadTabStrip tabStrip = (RadTabStrip)Page.FindControl("RadTabStrip1");
            RadTab educationInfoTab = tabStrip.FindTabByText("Education Info");
            educationInfoTab.Enabled = true;
            educationInfoTab.Selected = true;
 
            GoToNextPageView();
        }
 
        private void GoToNextPageView()
        {
            RadMultiPage multiPage = (RadMultiPage)Page.FindControl("RadMultiPage1");
            RadPageView educationInfoPageView = multiPage.FindPageViewByID("Education");
            if (educationInfoPageView == null)
            {
                educationInfoPageView = new RadPageView();
                educationInfoPageView.ID = "Education";
                multiPage.PageViews.Add(educationInfoPageView);
            }
            educationInfoPageView.Selected = true;
        }

Sharepoint Integration

asked on 06 Aug 2012

2 answers

184 views

Grid CommandItemTemplate dynamic content lost after AJAX call

I have a RadGrid using a CommandItemTemplate wrapped in an RadAjaxPanel:

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" ClientEvents-OnRequestStart="RequestStart" ClientEvents-OnResponseEnd="ResponseEnd" LoadingPanelID="RadAjaxLoadingPanel1">

<telerik:RadGrid ID="AccountGrid1" runat="server" OnNeedDataSource="AccountGrid1_NeedDataSource"

OnSortCommand="AccountGrid1_SortCommand" OnGroupsChanging="AccountGrid1_GroupsChanging" OnColumnCreated="AccountGrid1_ColumnCreated" OnItemCreated="AccountGrid1_ItemCreated"

AutoGenerateColumns="true" AllowPaging="true" AllowCustomPaging="true" AllowSorting="true" GroupingEnabled="true"

ShowGroupPanel="true" ShowFooter="true" ShowHeader="true">

<GroupingSettings CaseSensitive="false" />

<MasterTableView DataKeyNames="Id,ClientId" ClientDataKeyNames="Id" AllowNaturalSort="false"

AllowMultiColumnSorting="false" AllowCustomSorting="true" CommandItemDisplay="Top">

<CommandItemStyle HorizontalAlign="Right" />

<CommandItemTemplate>

<asp:LinkButton ID="RefreshLinkButton" runat="server" CommandName="RebindGrid"><%= Navigator.Icon("Refresh", "refresh").ToHtmlImage() %> Refresh</asp:LinkButton> |

<telerik:RadComboBox ID="gridStatCombo" runat="server" OnClientSelectedIndexChanged="EnableStatButton" DropDownWidth="250" Visible="false">

<Items>

<telerik:RadComboBoxItem Text="Select a field to group by" Value="" />

</Items>

</telerik:RadComboBox>

<telerik:RadComboBox ID="gridStatDateCombo" runat="server" Width="75" Visible="false" Enabled="false">

<Items>

<telerik:RadComboBoxItem Text="Day" Value="DAY" />

<telerik:RadComboBoxItem Text="Month" Value="MONTH" Selected="true" />

<telerik:RadComboBoxItem Text="Year" Value="YEAR" />

</Items>

</telerik:RadComboBox>

<telerik:RadButton ID="gridStatBtn" runat="server" Text="View Statistics" OnClick="Stat_Click" Enabled="false" Visible="false" /> |

<telerik:RadComboBox ID="gridExportCombo" runat="server" OnClientSelectedIndexChanged="EnableExportButton" DropDownWidth="250">

<Items>

<telerik:RadComboBoxItem Text="Select an export format" Value="" />

<telerik:RadComboBoxItem Text="Excel" Value="Excel" ImageUrl="~/Main/Content/Images/Icons/excel.png" />

<telerik:RadComboBoxItem Text="Word" Value="Word" ImageUrl="~/Main/Content/Images/Icons/ms_word_2.png" />

<telerik:RadComboBoxItem Text="PDF" Value="PDF" ImageUrl="~/Main/Content/Images/Icons/filetype_pdf.png" />

<telerik:RadComboBoxItem Text="Comma Separated Values (CSV)" Value="CSV" ImageUrl="~/Main/Content/Images/Icons/csv_file.png" />

<telerik:RadComboBoxItem Text="Tab-delimited" Value="Tab" ImageUrl="~/Main/Content/Images/Icons/txt_file.png" />

<telerik:RadComboBoxItem Text="Tab-delimited w/ Quotes" Value="TabQuote" ImageUrl="~/Main/Content/Images/Icons/txt_file.png" />

</Items>

</telerik:RadComboBox>

<telerik:RadButton ID="gridBtnExport" runat="server" Text="Export" OnClick="Export_Click" Enabled="false" />

</CommandItemTemplate>

<PagerStyle AlwaysVisible="true" />

</MasterTableView>

<ClientSettings AllowDragToGroup="true" AllowColumnsReorder="true">

<Selecting AllowRowSelect="true" />

<ClientEvents OnRowDblClick="ViewAccount" OnGridCreated="ResizeAccountGrid" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="100%" />

</ClientSettings>

<GroupingSettings ShowUnGroupButton="true" />

<FooterStyle HorizontalAlign="Right" />

<ExportSettings ExportOnlyData="true" HideStructureColumns="true" IgnorePaging="true"/>

</telerik:RadGrid>

<telerik:RadScriptBlock ID="AccountGridScriptBlock" runat="server">

<script type="text/javascript">

$(window).resize(function () { ResizeAccountGrid(); });

function ResizeAccountGrid(sender, eventArgs) {

ResizeGrid($find("<%= AccountGrid1.ClientID %>"));

}

function ViewAccount(sender, eventArgs) {

var accountId = eventArgs.get_gridDataItem().getDataKeyValue("Id");

ToolClick(null, null, "<%= Navigator.Inquiry() %>" + "?Id=" + accountId, "<%= (int)SiteNavigatorTab.Inquiry %>", false);

}

function RequestStart(sender, eventArgs) {

//Log the start time

startTime = new Date();

if (eventArgs.EventTarget.indexOf("gridBtnExport") > 0) {

eventArgs.EnableAjax = false;

}

function ResponseEnd(sender, eventArgs) {

//Log the end time

var endTime = new Date();

//Display the total time

//$get("<%= lblTotal.ClientID %>").innerHTML = endTime - startTime + " ms";

}

function EnableExportButton(sender, eventArgs) {

var item = eventArgs.get_item();

var button = $find('<%= (AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0]).FindControl("gridBtnExport").ClientID %>');

var selectedIndex = item.get_index();

button.set_enabled(selectedIndex != 0);

}

function EnableStatButton(sender, eventArgs) {

var item = eventArgs.get_item();

var button = $find('<%= (AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0]).FindControl("gridStatBtn").ClientID %>');

var dateBreak = $find('<%= (AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0]).FindControl("gridStatDateCombo").ClientID %>');

var selectedIndex = item.get_index();

button.set_enabled(selectedIndex != 0);

var dateFields = "<%= JsDateTimeFields %>".split("|");

var text = item.get_text();

var exists = $.inArray(text, dateFields) > -1;

dateBreak.set_enabled(exists);

}

</script>

</telerik:RadScriptBlock>

</telerik:RadAjaxPanel>

The RadComboBox (id gridStatCombo) is populated server side in Page_Load:

protected void Page_Load(object sender, EventArgs e)

{

var gridStatCombo = (RadComboBox)AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0].FindControl("gridStatCombo");

var gridStatDateCombo = (RadComboBox)AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0].FindControl("gridStatDateCombo");

var gridStatBtn = (RadButton)AccountGrid1.MasterTableView.GetItems(GridItemType.CommandItem)[0].FindControl("gridStatBtn");

foreach (var fieldName in Configuration[Vars.StatisticalReportFields].Value

.Split(new[] { ", " }, StringSplitOptions.RemoveEmptyEntries).OrderBy(f => f.Trim()))

{

if (!User.ParentCawClient.HasAccountField(fieldName)) continue;

var field = User.ParentCawClient.GetAccountField(fieldName);

gridStatCombo.Items.Add(new RadComboBoxItem(field.DisplayName, field.ColumnName));

if (SqlServerUtils.IsDateTimeSqlType(field.SqlDbType))

JsDateTimeFields += field.DisplayName + "|";

}

if (gridStatCombo.Items.Count > 1)

{

gridStatCombo.Visible = true;

gridStatDateCombo.Visible = true;

gridStatBtn.Visible = true;

}

This process works great on the initial load of the control. However, after making any form of Ajax call (sorting, paging, grouping, etc.) the combo box in the command item template is not updated. The content disappears. Stepping through the code, I can see that it is executed, but the control does not appear to be updated. The rest of the grid is updated via the Ajax call though.

What am I missing?

Grid

answered on 06 Aug 2012

1 answer

58 views

Radwindow close refresh event no causing needDataSource event to be fired on rebind

I have created a RadWindow/RadGrid combination that displays the RadWindow when a row on the grid is doubled clicked. I have javascript methods in both the RadWindow asp page and the grid's page (see code below) now when the window closes I need the NeedDataSource event to be fired when the rebind in the javascript is executed. I don't think that I am wiring the event correctly or performing the process correctly. Can you provide some advise?

RadWindow page javascript:

function CloseAndRebind {
    GetRadWindow().BrowserWindow.RefreshGrid(arg);
    RadWindow().Close();
}

RadGrid page javascript:

function RefreshGrid(arg) {
    $find("<%= RaidAjaxManager1.ClientID %>").AjaxRequest("Rebind");
}

Please note that the RadGrid is the UpdateControl in the RadAjaxManager. Also, the grid does appear to have an effect of all rows being highlighted on the rebind but the NeedDataSource is never called.

Thanks,

Steve Holdorf

Window

answered on 06 Aug 2012

1 answer

56 views

how to avoid fast blinking cursor in input controls (Telerik) ASP.net 2.0

Hi,

I am working on a asp.net 2.0 project. We used telerik controls very heavily.

I open a popup window from another popup window, when I put cursor in any input, dropdown, date time controls, Cursor blinks slow, then it blinks very fast, after some time again slow.
This thing is keep on going. Looks like cursor is flicking or something.

Have anyone come up with this scenario?, I will really appreciate if someone could help me.

Thanks

General Discussions

answered on 06 Aug 2012

2 answers

115 views

Boolean field one-click Edit

I am using MS Visual Studio 2010 in a 3.5 environment.
I am using Microsoft Vista (32 bit)
The database is currently located on an SQL 2005 server.
I am using RadGrid & tools, version 2012.1.411.35
I am using both Chrome (18.0.1025.168) and Internet Explorer (8.0.7600.16385)
I am programming in VB.net

I have a rad grid with three boolean fields in it. The boolean fields show up as checkboxes. I would like the end user to be able to click these and toggle the value WITHOUT having to click the Edit command first.

How can I do this?

Grid

answered on 06 Aug 2012

1 answer

61 views

Exporting breaks all subsequent submits

I have the following code:

<telerik:RadGrid ID="AuditRadGrid" runat="server" AllowPaging="true" AllowCustomPaging="true"

OnNeedDataSource="AuditRadGrid_NeedDataSource">

<ExportSettings HideStructureColumns="true" IgnorePaging="true"/>

<MasterTableView AutoGenerateColumns="false" DataKeyNames="ActivityDate" CommandItemDisplay="Top"

CommandItemStyle-HorizontalAlign="Right">

<CommandItemSettings ShowAddNewRecordButton="false" ShowExportToExcelButton="true"

ShowExportToCsvButton="true" ShowRefreshButton="false" />

<Columns>

<telerik:GridBoundColumn HeaderText="Date" DataField="ActivityDate" Visible="true" />

<telerik:GridBoundColumn HeaderText="Change" DataField="ActivityDescription" Visible="true" />

<telerik:GridBoundColumn HeaderText="Username" DataField="ActivityByUserName" Visible="true" />

</Columns>

<PagerStyle AlwaysVisible="true" />

</MasterTableView>

</telerik:RadGrid>

This works as expected when I click either Excel or CSV export icon. The problem is that after clicking an export icons the first time, no other submits on the page work.

I refresh the page, click Excel, an Excel file is exported. I click CSV, and nothing happens. I click my other submit buttons on the form, and nothing happens.

Anyone have ideas on this?

Grid

answered on 06 Aug 2012

1 answer

187 views

Clientside sorting issues with null cells

I've got some problems with the clientside sorting. It only seems to be where I've got null values inside a column. Interestingly, it doesn't work in any of the browsers, but it behaves differently, just all of them incorrectly.

@(Html.Telerik().Grid(Model)

.Name("DellGrid")

.DataKeys(keys => keys.Add(m => m.ServiceTag))

.DataBinding(dataBinding => dataBinding

.Ajax()

.OperationMode(GridOperationMode.Client)

.Select("Index", "DellSystem")

.Update("Edit", "DellSystem"))

.Columns(columns =>

{

columns.Bound(m => m.ServiceTag)

.Title("Service Tag");

columns.Bound(m => m.Family)

.Title("Family");

columns.Bound(m => m.LOB)

.Title("LOB");

columns.Bound(m => m.ModelNumber)

.Title("Model Number");

columns.Bound(m => m.ServiceDate)

.Title("Service Date");

columns.Bound(m => m.RetireDate)

.Title("Retire Date");

columns.Bound(m => m.User)

.Title("Altiris User");

columns.Bound(m => m.CurrentUser)

.Title("Current User");

columns.Bound(m => m.Whse)

.Title("Location");

columns.Bound(m => m.Name)

.Title("Computer Name");

columns.Command(commands =>

{

commands.Custom("Edit").ButtonType(GridButtonType.Image)

.ImageHtmlAttributes(new { @class = "t-icon t-edit" })

.Text("Edit")

.Action("Edit", "DellSystem");

}).Width(150);

})

.Groupable()

.Sortable()

.Pageable(page => page.PageSize(20))

)

Also, when you sort a column, the ImageHtmlAttributes section seems to be lost as I lose my icon for the edit button:

columns.Command(commands =>

{

commands.Custom("Edit").ButtonType(GridButtonType.Image)

.ImageHtmlAttributes(new { @class = "t-icon t-edit" })

.Text("Edit")

.Action("Edit", "DellSystem");

}).Width(150);

I've attached a few screen shots to demonstrate.

Any ideas?

Thanks,
-Sid.

Grid

answered on 06 Aug 2012

1 answer

144 views

RadEditor Slow in rendering

Hi due to some requirements i m using 7 radeditors in one page.

Now, the problem is, the page is not at all loading when the site is hosted in a server. It takes almost 20 minutes for the page to load and by then the session is expired.

Is there any workaround for this? Kind suggestion please? I'm using 2008 version of Telerik DLL.

Waiting for your reply...Please

Editor

answered on 06 Aug 2012

3 answers

111 views

Autocomplete with Filtering

i want to autocomplete and filtering Functionality in One/Same RadComboBox.

http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/autocompleteclientside/defaultcs.aspx

http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/filteringcombo/defaultcs.aspx

ComboBox

answered on 06 Aug 2012

11 answers

219 views

Custom values for grid with automatic CRUD operations with two way data binding

I have a grid bound to an EntityDataSource control. Both the EntityDataSource and the grid have automatic CRUD operations enabled. And using two way data binding everything works as expected. But there are a couple of database fields not on the form, who still need their values to be set.

I thought something like this should do the trick:

var item = e.Item as GridEditableItem;

if

(item == null)

return;



var values =

new ListDictionary();

item.ExtractValues(values);



values.Add(

"Field", "Value");

e.Item.OwnerTableView.InsertItem(values);

The above code is placed within the OnInsert- and OnUpdateCommand events of the grid. But it seems like the ListDictionary isn't updated with the onde containing the custom value. How can I achieve this? I can not imagine I'm the first one stumbling upon this, but I can't find anything on this subject on the forums.

I hope someone can help me out...

Hendrik

Grid

answered on 06 Aug 2012