Questions on UI for ASP.NET AJAX Forum

1 answer

122 views

Rotator Displaying 4 Buttons

The Rotator is displaying 4 buttons... Up, Down, Left, Right.
How can I hide, Up and Down?

Thanks.

JC

Rotator

answered on 07 Feb 2017

0 answers

126 views

Passing querystring variable to bootstrap modal to retrieve detail data

I amusing this technique to set an edit link in a grid template column.

editlink.Attributes.Add("href", "#");
editlink.Attributes.Add("onclick", string.Format("return ShowEditForm('{0}','{1}');", e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["SubscriberID"], e.Item.ItemIndex));

In the past, I have called a telerik window with a separate aspx page that would display the detail record data for the ID that was passed in the querystring.

I am now working with bootstrap and would like to do this with a bootstrap modal.

Are there any examples where this has been done?

General Discussions

asked on 07 Feb 2017

0 answers

161 views

Radgrid Filtering binding with ajax Call

Hi,

Well i am new to Sitefinity. I was trying to implement Dynamic Sorting Filtering and Pagination in client side. I have implemented sorting and pagination. I want to implement excel type filtering as explained in the demo ( http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/filtering/excel-like-filtering/defaultcs.aspx) to my department column. The issue is i cant use FilterType="HeaderContext". I get a issue saying The values permitted for this attribute dosent inclue HeaderContext. I went to multiple article but couldn't figure out. Can you please help me out. The other issue is i am binding my radgrid in ajax call i don't know how to bind the data for the filtering in ajax call and how to pass filter data from ajax call to webservice.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="SitefinityWebApp.Pages.test" EnableEventValidation="true" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="sf" Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.PublicControls" %>

<html xmlns='http://www.w3.org/1999/xhtml'>

<head runat="server">
<title>Telerik ASP.NET Example</title>

<telerik:RadScriptBlock ID="RadCodeBlock" runat="server">
<script type="text/javascript">

function rad_gridCreated(sender, args) {
tableView = $find("<%= gridData.ClientID %>").get_masterTableView();
makeServiceCall(updateGrid, serviceFailure);
};

function serviceFailure(error) { alert("failure " + error.statusText); };
function updateGrid(result) {
tableView.set_dataSource(result.employee);
tableView.dataBind();
tableView.set_virtualItemCount(result.totalCount);
};
function getRequestStringfyData(startIndex, pageSize, sortExpression, filterExpression) {
return JSON.stringify({
startIndex: startIndex,
maximumRows: pageSize,
sortExpression: sortExpression,
filterExpression: filterExpression
});
};

function makeURL(startIndex, pageSize, sortExpression, filterExpression) {
return "/CustomServices/NewsService/getmyWork?startIndex=" + startIndex + "&maximumRows=" + pageSize + "&sortExpression=" + sortExpression + "&filterExpression=" + filterExpression;
};

function makeServiceCall(onCallBackSuccess, onCallbackFailure) {
var pageSize = tableView.get_pageSize(); var startIndex = (tableView.get_currentPageIndex() * pageSize);
var sortExpression = tableView.get_sortExpressions().toString(); var filterExpression = "";
$.ajax({
type: "GET",
url: makeURL(startIndex, pageSize, sortExpression, filterExpression),
dataType: "json",
data: getRequestStringfyData(startIndex, pageSize, sortExpression, filterExpression),
contentType: "application/json; charset=utf-8",
processData: true,
success: onCallBackSuccess,
error: onCallbackFailure
});
};

function radgrid_OnCommand(sender, args) {
tableView = sender.get_masterTableView();
makeServiceCall(updateGrid, serviceFailure);
};
</script>
</telerik:RadScriptBlock>

</head>
<body>
<form id="form1" runat="server">

<script type="text/javascript" src="test.js"></script>

<telerik:RadScriptManager runat="server" ID="RadScriptManager1">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>
<div style="margin-top: 100px;">
<asp:UpdatePanel ID="ProductsUpdatePanel" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
<ContentTemplate>
<telerik:RadGrid RenderMode="LightWeight" ID="gridData" name="gridData" runat="server" EnableViewState="false" AutoGenerateColumns="false" AllowPaging="true" PageSize="10" AllowSorting="true" FilterType="HeaderContext">
<MasterTableView TableLayout="Fixed">
<Columns>
<telerik:GridBoundColumn DataField="EmpID" HeaderText="Emp ID" ReadOnly="true" SortExpression="EmpID" UniqueName="EmpID" />
<telerik:GridBoundColumn DataField="FirstName" HeaderText="First Name" ReadOnly="true" SortExpression="FirstName" UniqueName="FirstName" />
<telerik:GridBoundColumn DataField="LastName" HeaderText="Last Name" ReadOnly="true" SortExpression="LastName" UniqueName="LastName" />
<telerik:GridBoundColumn DataField="Department" HeaderText="Department" ReadOnly="true" SortExpression="Department" UniqueName="Department" />
</Columns>
</MasterTableView>
<ClientSettings EnablePostBackOnRowClick="false">
<ClientEvents OnCommand="radgrid_OnCommand" OnGridCreated="rad_gridCreated" />
</ClientSettings>
</telerik:RadGrid>
</ContentTemplate>
</asp:UpdatePanel>
</div>

</form>
</body>
</html>

Interface

namespace SitefinityWebApp.CustomServices
{
[ServiceContract]
[AllowDynamicFields]
public interface INewsService
{
[OperationContract]
[WebInvoke(Method = "GET", UriTemplate = "getmyWork?startIndex={startIndex}&maximumRows={maximumRows}&sortExpression={sortExpression}&filterExpression={filterExpression}", ResponseFormat = WebMessageFormat.Json, RequestFormat = WebMessageFormat.Json)]
SitefinityWebApp.CustomServices.NewsService.DynamicItemsContext DoWork(int startIndex, int maximumRows, string sortExpression, string filterExpression);
}

wcf class

[ServiceBehavior(IncludeExceptionDetailInFaults = true, InstanceContextMode = InstanceContextMode.Single, ConcurrencyMode = ConcurrencyMode.Single)]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Required)]
public class NewsService : INewsService
{

public DynamicItemsContext RetrieveItems(int startIndex, int maximumRows, string sortExpression)
{
DynamicModuleManager dynamicModuleManager = DynamicModuleManager.GetManager();
Type testType = TypeResolutionService.ResolveType("Telerik.Sitefinity.DynamicTypes.Model.Employees.Employee");
var dynamicItems = dynamicModuleManager.GetDataItems(testType).Where(d => d.Status == Telerik.Sitefinity.GenericContent.Model.ContentLifecycleStatus.Master);

if (!string.IsNullOrEmpty(sortExpression))
dynamicItems = dynamicItems.OrderBy(sortExpression);

List<Employee> employees = new List<Employee>();
foreach (var item in dynamicItems)
{
var employee = new Employee();
employee.FirstName = item.GetValue("FirstName").ToString();
employee.LastName = item.GetValue("LastName").ToString();
employee.Department = item.GetValue("Department").ToString();
employee.EmpID = item.GetValue("EmpID").ToString();
employees.Add(employee);
}

var dynamicItemContext = new DynamicItemsContext();
dynamicItemContext.totalCount = employees.Count;
dynamicItemContext.employee = employees;
dynamicItemContext.employee = dynamicItemContext.employee.Skip(startIndex).Take(maximumRows);
// employees.Skip(startIndex).Take(maximumRows);
return dynamicItemContext;
}

public DynamicItemsContext DoWork(int startIndex, int maximumRows, string sortExpression, string filterExpression)
{
var items = RetrieveItems(startIndex, maximumRows, sortExpression);
return items;
}

public class Employee
{
public string FirstName { get; set; }
public string LastName { get; set; }
public string Department { get; set; }
public string EmpID { get; set; }
}

[DataContract]
[KnownType(typeof(Employee))]
public class DynamicItemsContext
{
[DataMember]
public IEnumerable<Employee> employee { get; set; }

[DataMember]
public int totalCount { get; set; }

}
}

Ajax

asked on 07 Feb 2017

9 answers

152 views

Export CustomAttributeNames to Ical from Radscheduler

I'm using the radscheduler to export a timetable to iCAL - I need to include more fields (ie location, staff) to export than just the start date time ,title , description etc, and so have added 2 fields in the CustomAttributeNames, - these appear on the calendar but are not included in the export file - is this possible or is outlook/google not able to read these fields?

Are there more fields that can be added to the Vcard - ie location or are these not included in the Telerik control.

Thanks

Scheduler

answered on 07 Feb 2017

6 answers

446 views

Data gets lost when I perform postback on grid

Hi.

I have a RadGrid on an ASP.NET page. When I do something that requieres a postback directly on the grid, like changing the page size, or browsing to a new page in the grid, my data gets lost and my grid becomes empty. Here's my markup:

<telerik:RadGrid ID="ReporteGridView" runat="server" AllowPaging="True" PageSize="20"

AllowAutomaticInserts="false" AllowSorting="True" ShowStatusBar="true" Width="880px">

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

<MasterTableView NoMasterRecordsText="No hay registros para mostrar" ShowHeadersWhenNoRecords="True"

PageSize="20" CommandItemDisplay="None" Width="100%">

<PagerStyle FirstPageToolTip="Primera página" LastPageToolTip="Ultima página" NextPagesToolTip="Página siguiente"

PageSizeLabelText="Tamaño página" PrevPagesToolTip="Página anterior" />

<RowIndicatorColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="True"></Scrolling>

</ClientSettings>

</telerik:RadGrid>

I'm binding my grid to a DataTable at runtime. Is there something I'm missing?

Thanks.

Grid

answered on 07 Feb 2017

7 answers

422 views

Radgrid Grouping Collapse Expand

Hi
I have a RadGrid with Grouping, Collapse and Expand functionality.
That works very well.

My problem:
When I click the command "Edit", edit mode = "popup", go to Collapse and Expand selections lost.
What can I do that the users stay with selection Collapse and Expand exist forever?

Sorry for my bad English
Rolf Burri
Switzerland

<telerik:RadGrid ID="RadGrid_Zeiten" runat="server" AutoGenerateColumns="False"
DataSourceID="SqlDataSource_Zeiten" GridLines="Vertical" Skin="Office2007"
AllowAutomaticUpdates="True" AutoGenerateEditColumn="True"
style="font-weight: 700">
<ExportSettings ExportOnlyData="True" IgnorePaging="True">
</ExportSettings>
<MasterTableView CommandItemDisplay="None" datakeynames="ID"
datasourceid="SqlDataSource_Zeiten" editmode="PopUp" font-bold="False"
font-italic="False" font-names="Verdana" font-overline="False" font-size="8"
font-strikeout="False" font-underline="False">
<RowIndicatorColumn>
<HeaderStyle Width="20px" />
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px" />
</ExpandCollapseColumn>
<GroupByExpressions>
<telerik:GridGroupByExpression>
<SelectFields>
<telerik:GridGroupByField FieldName="nachname" HeaderText=" "
HeaderValueSeparator=" " />
<telerik:GridGroupByField FieldName="vorname" HeaderText=" "
HeaderValueSeparator=" " />
</SelectFields>
<GroupByFields>
<telerik:GridGroupByField FieldName="username" SortOrder="Ascending" />
</GroupByFields>
</telerik:GridGroupByExpression>
</GroupByExpressions>
<Columns>
<telerik:GridBoundColumn DataField="user_id" ReadOnly="True"
SortExpression="user_id" UniqueName="user_id" Visible="False">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="name_tag" HeaderText="Tag"
SortExpression="name_tag" UniqueName="name_tag" ReadOnly="True">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Datum" DataFormatString="{0:dd.MM.yyyy}"
HeaderText="Datum" SortExpression="Datum" UniqueName="Datum"
ReadOnly="True">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Vorname" HeaderText="Vorname"
SortExpression="Vorname" UniqueName="Vorname" ReadOnly="True">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Nachname" HeaderText="Nachname"
SortExpression="Nachname" UniqueName="Nachname" ReadOnly="True">
</telerik:GridBoundColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_1_von"
DataFormatString="{0:HH:mm}" HeaderText="Von" PickerType="TimePicker"
UniqueName="arbeitszeiten_1_von">
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_1_bis"
DataFormatString="{0:HH:mm}" HeaderText="Bis" PickerType="TimePicker"
UniqueName="arbeitszeiten_1_bis">
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_2_von"
DataFormatString="{0:HH:mm}" HeaderText="Von" PickerType="TimePicker"
UniqueName="arbeitszeiten_2_von">
<ItemStyle BackColor="#E6EBF3" />
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_2_bis"
DataFormatString="{0:HH:mm}" HeaderText="Bis" PickerType="TimePicker"
UniqueName="arbeitszeiten_2_bis">
<ItemStyle BackColor="#E6EBF3" />
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_3_von"
DataFormatString="{0:HH:mm}" HeaderText="Von" PickerType="TimePicker"
UniqueName="arbeitszeiten_3_von">
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_3_bis"
DataFormatString="{0:HH:mm}" HeaderText="Bis" PickerType="TimePicker"
UniqueName="arbeitszeiten_3_bis">
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_4_von"
DataFormatString="{0:HH:mm}" HeaderText="Von" PickerType="TimePicker"
UniqueName="arbeitszeiten_4_von">
<ItemStyle BackColor="#E6EBF3" />
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn DataField="arbeitszeiten_4_bis"
DataFormatString="{0:HH:mm}" HeaderText="Bis" PickerType="TimePicker"
UniqueName="arbeitszeiten_4_bis">
<ItemStyle BackColor="#E6EBF3" />
</telerik:GridDateTimeColumn>
<telerik:GridBoundColumn DataField="total_zeiten" HeaderText="Total Zeiten"
UniqueName="total_zeiten" ReadOnly="True" SortExpression="total_zeiten">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="total_arbeiten" HeaderText="Total Arbeiten"
ReadOnly="True" SortExpression="total_arbeiten" UniqueName="total_arbeiten">
</telerik:GridBoundColumn>
<telerik:GridCheckBoxColumn DataField="abgeschlossen" HeaderText="Gesendet"
ReadOnly="True" UniqueName="abgeschlossen">
</telerik:GridCheckBoxColumn>
</Columns>
<EditFormSettings>
<EditColumn UniqueName="EditCommandColumn1">
</EditColumn>
<FormStyle BackColor="#E6EBF3" />
<FormTableStyle BackColor="#E6EBF3" />
<FormMainTableStyle BackColor="#E6EBF3" BorderStyle="Double" />
<FormTableItemStyle BorderStyle="Solid" Height="20px" />
<FormTableAlternatingItemStyle BackColor="White" Height="20px" />
</EditFormSettings>
<GroupHeaderItemStyle Font-Bold="True" ForeColor="Black" />
</MasterTableView>
<GroupingSettings GroupByFieldsSeparator="" />
<GroupHeaderItemStyle Font-Bold="True" ForeColor="Black" />
<FilterMenu EnableTheming="True" Skin="Gray">
<CollapseAnimation Duration="200" Type="OutQuint" />
</FilterMenu>
</telerik:RadGrid>

Grid

answered on 07 Feb 2017

6 answers

467 views

Background colour not changing for readonly inputs

Here's what I did:
1. Created a new skin based on Hay using the Online Visual Style Builder.
2. Changed the background colour of the input control in read only state.
3. Downloaded and extracted the modified style to my skin directory.

These lines have been added to the CSS file:

.RadInput_MMSM_MTS input.riRead {

background-color: rgb(216, 216, 216);

}

Using Firebug to inspect I see this rule has been crossed out:

.RadInput_MMSM_MTS input.riRead {

background-color: #D8D8D8;

}

And this rule is in effect (except for the border-color)::

html body .RadInput_MMSM_MTS .riTextBox, html body .RadInputMgr_MMSM_MTS {

background: none repeat scroll 0 0 #FFFFFF;

border-color: #898772;

color: #272722;

font: 12px "segoe ui",arial,sans-serif;

}

How can this be fixed? When I uploaded the zip file I noted the style tool did not recognize the change. The textbox is simply declared as:

<telerik:RadTextBox ID="RadTextBox1" runat="server" ReadOnly="True">

</telerik:RadTextBox>

Visual Style Builder

answered on 07 Feb 2017

1 answer

131 views

Grid Issues With Chrome

I'm having an issue with the veritcal size of the Radgrid in chrome. Each time a control refreshes the grid the grid resizes and I lose the command menu at the bottom of the grid.

This issue only happens in Chrome, i'm unable to replicate it on other browsers.

Grid

answered on 07 Feb 2017

1 answer

171 views

Styling exported pdf programmatically

Hi

I am trying to style the generated table using the 'ApplyStylesToPdfExport' example, and all is working with fonts, and alignment, but I haven't found the way to set cell padding. I tried using cell.style("cellpadding") = "5px" and, a few variants, but I can't make it work. What is the right way to do this?

I am probably being dumb...

Thanks a lot

Clive

Grid

answered on 07 Feb 2017

0 answers

131 views

CustomValidator on GridDropDown column doesn't work

This code isn't firing the custom validator's ServerValidate event for my GridDropDown column. The exact same code works fine if I hook it into a standard GridBoundColumn with an underlying TextBox control and the necessary underlying control type changes.

protected void dtgFields_ItemCreated(object sender, GridItemEventArgs e)
{
if (e.Item is GridEditableItem && e.Item.IsInEditMode)
{
GridEditableItem item = e.Item as GridEditableItem;

GridDropDownListColumnEditor editor = (GridDropDownListColumnEditor)item.EditManager.GetColumnEditor("EDocFieldTagCtl");
TableCell cell = (TableCell)editor.ComboBoxControl.Parent;

CustomValidator validator = new CustomValidator();
validator.ControlToValidate = editor.ComboBoxControl.ID;
validator.ErrorMessage = "testing custom validator";
validator.Display = ValidatorDisplay.Dynamic;
validator.ServerValidate += new ServerValidateEventHandler(tagvalidate);
cell.Controls.Add(validator);
}
}

Grid

asked on 07 Feb 2017