Questions on UI for ASP.NET AJAX Forum

1 answer

142 views

client-side filter commandArgument and '?' character

looking at the client-side filter commandArgument, it has this format: ColumnName|?FilterValue|?FilterFunction

Is the '?' character used so you have two characters as delimiters ('|?').

Or is it used for something else. If the latter, I can strip the first character from the value to use it. But if the former I assume I can just split the commandArgument on '|?'.

If I do the split, I just want make sure you won't be changing this delimiter.

Grid

answered on 21 Mar 2017

1 answer

212 views

Pivot grid bind to multiple chart

Hello,
I have pivot grid control and I'm trying to display several charts according to this pivot.
when the data is expanded the charts present correct data but when I start collapsing the columns the data in the charts starts freaking out and some of the data is missing and the other one is incorrect or displaying duplicated values.
I have tried the solutions proposed in the following thread: but seems like it still doesn't work.

any idea?

Please see the code below.

001.functionloadPivotWWvsBoard() {

002. $("#divPivot").html("");

003. $("#divConfigurator").html("");

004. var collapsed = {

005. columns: [],

006. rows: []

007. };

008. /*define the data source*/var DataSource;

009.

010. jQuery.ajaxSetup({

011. async: false

012. });

013.

014. $.get("/Report/GetDeliveredReportJSON", { fromWW: $("#FromWW").val(), toWW: $("#ToWW").val() }).done(function (data) {

015. DataSource = data;

016. })

017.

018. var dataSource = new kendo.data.PivotDataSource({

019. data: DataSource

020. , type: "xmla"

021. , schema: {

022. model: {

023. fields: {

024. "Project": {

025. type: "string"

026. }

027. , Board: {

028. type: "string"

029. }

030. , WW: {

031. type: "string"

032. }

033. , "ApproveDate": {

034. field: "ApproveDate"

035. , type: "date"

036. }

037. , ReceiverName: {

038. field: "ReceiverName"

039. }

040. , RequestorName: {

041. field: "RequestorName"

042. }

043. , ApprovingManager: {

044. field: "ApprovingManager"

045. }

046. , PartTrans: {

047. field: "PartTrans"

048. }

049. , SerialNumber: {

050. field: "SerialNumber"

051. }

052. , OpeningDate: {

053. field: "OpeningDate"

054. }

055. , DeliveredDate: {

056. field: "DeliveredDate"

057. }

058. , ApprovalType: {

059. field: "ApprovalType"

060. }

061. , DateDifference: {

062. field: "DateDifference"

063. }

064. , ReportType: {

065. field: "ReportType"

066. }

067. , BusinessLine: {

068. field: "BusinessLine"

069. }

070. , Branch: {

071. field: "Branch"

072. }

073. , ManagerType: {

074. field: "ManagerType"

075. }

076. , CostCenter: {

077. field: "CostCenter"

078. }

079. , SapOrder: {

080. field: "SapOrder"

081. }

082. ,

083. }

084. }

085. , cube: {

086. dimensions: {

087. "Project": {

088. caption: "Project"

089. }

090. , Board: {

091. caption: "Board"

092. }

093. , WW: {

094. caption: "WW"

095. }

096. , "ApproveDate": {

097. caption: "Approve Date"

098. }

099. }

100. , measures: {

101. "Delivered Quantity": {

102. field: "SerialNumber"

103. , aggregate: "count"

104. }

105. }

106. }

107. }

108. , columns: [{

109. name: "Project", expand: true

110. },

111. {

112. name: "Board", expand: true

113. }]

114. , rows: [{

115. name: "WW"

116. }]

117. , measures: ["Delivered Quantity"]

118. });

119.

120. dataSource.filter(loadFiltersForGrid(false))

121. dataSource.fetch(function () {

122. console.log("data source created successfuly", dataSource);

123. });

124.

125. /*define the pivot*/var pivotgrid = $("#divPivot")

126. .kendoPivotGrid({

127. filterable: true,

128. sortable: true,

129. collapseMember: function (e) {

130. var axis = collapsed[e.axis];

131. var path = e.path[0];

132.

133. if (axis.indexOf(path) === -1) {

134. axis.push(path);

135. }

136. },

137. expandMember: function (e) {

138. var axis = collapsed[e.axis];

139. var index = axis.indexOf(e.path[0]);

140.

141. if (index !== -1) {

142. axis.splice(index, 1);

143. }

144. },

145. dataSource: dataSource

146. , dataBound: function () {

147. this.dataSource.expandColumn(["Project", "Board"]);

148. this.dataSource.expandColumn(["Project"]);

149. this.dataSource.expandRow(["WW"]);

150. // this.dataSource.filter(filters);

151. initChart(convertData(this.dataSource, collapsed, "Project"));

152. initChart2(convertData(this.dataSource, collapsed, "Board"));

153. }

154. })

155. .data("kendoPivotGrid");

156.

157.

158. /*define the chart*/functioninitChart(data) {

159.

160. $("#divChart1").kendoChart({

161. dataSource: {

162. data: data,

163. group: "column"

164. },

165. title: {

166. text: "Delivered quantity by project"

167. },

168. legend: {

169. position: "top"

170. },

171. seriesDefaults: {

172. type: "bar"

173. },

174. series: [{

175. type: "column",

176. field: "measure",

177. }],

178. categoryAxis: {

179. field: "row"

180. , padding: {

181. top: 135

182. }

183. , majorGridLines: {

184. visible: true

185. }

186. },

187. valueAxis: {

188. majorGridLines: {

189. visible: true

190. }

191. },

192. tooltip: {

193. visible: true,

194. format: "{0}",

195. template: "#= series.name #: #= value #"

196. },

197. dataBound: function (e) {

198. // e.sender.options.categoryAxis.categories.sort()

199. }

200. });

201. }

202. functioninitChart2(data) {

203.

204. $("#divChart2").kendoChart({

205. dataSource: {

206. data: data,

207. group: "column"

208. },

209. title: {

210. text: "Delivered quantity by board"

211. },

212. legend: {

213. position: "top"

214. },

215. seriesDefaults: {

216. type: "bar"

217. },

218. series: [{

219. type: "column",

220. field: "measure",

221. }],

222. categoryAxis: {

223. field: "row"

224. , padding: {

225. top: 135

226. }

227. , majorGridLines: {

228. visible: true

229. }

230. },

231. valueAxis: {

232. majorGridLines: {

233. visible: true

234. }

235. },

236. tooltip: {

237. visible: true,

238. format: "{0}",

239. template: "#= series.name #: #= value #"

240. },

241. dataBound: function (e) {

242. // e.sender.options.categoryAxis.categories.sort()

243. }

244. });

245. }

246.}

247.

248.functionflattenTree(tuples) {

249. tuples = tuples.slice();

250. var result = [];

251. var tuple = tuples.shift();

252. var idx, length, spliceIndex, children, member;

253.

254. while (tuple) {

255. //required for multiple measuresif (tuple.dataIndex !== undefined) {

256. result.push(tuple);

257. }

258.

259. spliceIndex = 0;

260. for (idx = 0, length = tuple.members.length; idx < length; idx++) {

261. member = tuple.members[idx];

262. children = member.children;

263. if (member.measure) {

264. [].splice.apply(tuples, [0, 0].concat(children));

265. } else {

266. [].splice.apply(tuples, [spliceIndex, 0].concat(children));

267. }

268. spliceIndex += children.length;

269. }

270.

271. tuple = tuples.shift();

272. }

273.

274. return result;

275.}

276.

277.functionisCollapsed(tuple, collapsed) {

278. var name = tuple.members[0].parentName;

279.

280. for (var idx = 0, length = collapsed.length; idx < length; idx++) {

281. if (collapsed[idx] === name) {

282. console.log(name);

283. returntrue;

284. }

285. }

286.

287. returnfalse;

288.}

289.

290.functionconvertData(dataSource, collapsed, type) {

291. var columnTuples = flattenTree(dataSource.axes().columns.tuples || [], collapsed.columns);

292. var rowTuples = flattenTree(dataSource.axes().rows.tuples || [], collapsed.rows);

293. var data = dataSource.data();

294. var rowTuple, columnTuple;

295.

296. var idx = 0;

297. var result = [];

298. var columnsLength = columnTuples.length;

299.

300. for (var i = 0; i < rowTuples.length; i++) {

301. rowTuple = rowTuples[i];

302.

303. if (!isCollapsed(rowTuple, collapsed.rows)) {

304. for (var j = 0; j < columnsLength; j++) {

305. columnTuple = columnTuples[j];

306.

307. if (!isCollapsed(columnTuple, collapsed.columns)) {

308. if (idx > columnsLength && idx % columnsLength !== 0) {

309.

310. var memebrtype;

311. if (type == "Board") {

312. memebrtype = 1

313. } else {

314. memebrtype = 0

315. }

316. var columninfo = GetChildren(columnTuple.members[memebrtype], type);

317. if (columninfo) {

318. result.push({

319. measure: Number(data[idx].value),

320. column: columninfo,

321. row: rowTuple.members[0].caption

322. });

323. }

324.

325. }

326. }

327. idx += 1;

328. }

329. }

330. }

331.

332. return result;

333.}

334.

335.

336.functionGetChildren(parent, type) {

337. var result = undefined;

338.

339. if (parent.hasChildren || result != undefined) {

340. for (var i = 0; i < parent.children.length; i++) {

341. result = GetChildren(parent.children[i], type);

342. }

343. } else {

344. result = parent.caption;

345. }

346. if (result == type) {

347. result = undefined;

348. }

349.

350.

351. return result;

352.}

.

PivotGrid

answered on 21 Mar 2017

6 answers

602 views

Finding all telerik radcontrols in a form

Telerik Team,

I need to set the ForeColor of all the "Telerik RadControls" in my given form on a specific action. How do I loop through to find out all the Tlerik Controls Exists in my form. Let me know

Thanks

Jai

General Discussions

answered on 21 Mar 2017

1 answer

219 views

Calculation expressions : available formulas

Hi,

I am currently doing advanced calculations in Pivot grid using calculation expressions.
I would like to use Square root function inside (sqrt). What are available function ?

aggregateField.CalculationExpression = "(({0}/{1})*({1}-{2})";

i would like something like this to be evaluated :

aggregateField.CalculationExpression = "(({0}/{1})*(Sqrt({1}-{2}))";

in my case i would like to avoid using OnItemNeedCalculation event, because all formulas are downloaded from a database dynamically, and it creates dynamically aggregates in pivot grid.

Regards,

Maxime LEMARE

PivotGrid

answered on 21 Mar 2017

5 answers

578 views

Export to Excel - hide header row?

On an export to Excel, I can't seem to find a way to suppress the header row. I'm creating the grid programmatically. Here's the relevant code:

RadGrid

exportGrid = new RadGrid();

exportGrid.NeedDataSource +=

new GridNeedDataSourceEventHandler( exportGrid_NeedDataSource );

exportGrid.Skin =

"Default";
exportGrid.Width = Unit.Percentage( 100 );
exportGrid.ShowHeader = false;
exportGrid.AutoGenerateColumns = true;
exportGrid.ExportSettings.ExportOnlyData = true;
exportGrid.ExportSettings.Excel.Format = GridExcelExportFormat.ExcelML;
exportGrid.DataMember = "ExportData";
PlaceHolder phExport = new PlaceHolder();
currentPage.Controls.Add( phExport );
exportGrid.DataSource = _exportData;
phExport.Controls.Add( exportGrid );
exportGrid.Rebind();

foreach ( GridHeaderItem headerItem in exportGrid.MasterTableView.GetItems( GridItemType.Header ) )
headerItem.Visible = false;

exportGrid.MasterTableView.ExportToExcel();

I also tried a couple of different variations on this approach, without any luck:

protected

void exportGrid_ExcelMLExportRowCreated( object source, Telerik.Web.UI.GridExcelBuilder.GridExportExcelMLRowCreatedArgs e ){
if ( e.RowType == Telerik.Web.UI.GridExcelBuilder.GridExportExcelMLRowType.HeaderRow ){
foreach ( Telerik.Web.UI.GridExcelBuilder.CellElement cell in e.Row.Cells ){
if( cell.Data != null )
cell.Data.DataItem = null;
}
}
}

Any help is appreciated.

Grid

answered on 21 Mar 2017

0 answers

61 views

Add a button to multiple grids programmatically

I have a project with many, many grids. I want to add a clear all filters button to every grid in my project. I have a clear all method that works beautifully, but I can't seem to add a button with a successful event handler to all my grids without manually going through and adding the button. I would like it somewhere at the top of my grid. Any help would be appreciated.

Grid

asked on 20 Mar 2017

9 answers

145 views

originalPath, originalAttribute inserted into javascript code in IE

Here's the sample code I'm using:

</noscript>

When I add the code to the HTML mode, then switch to the Design Mode, then switch back to the HTML mode,
1) the <script> tags disappear, and
2) the <noscript> tags have inserted "originalAttribute=X" and "originalPath=Y" into the anchor tags.

In IE only (I'm using IE 8), both 1 and 2 can be reproduced by pasting the sample code above into the Editor Demo: http://demos.telerik.com/aspnet-ajax/editor/examples/default/defaultcs.aspx.

Thanks.

Editor

answered on 20 Mar 2017

1 answer

238 views

ScriptManager conflicts

I have a webform with an aspscripmanager and and radsciptmanager but for some reason they dont like working together at all. My code is below:

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

    <div style="width: 100%; height: 100%">
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <div id="divImage" style="display:none">
                    <asp:Image ID="img1" runat="server" ImageUrl="~/Image/ajax-loader3.gif" />
                    Processing....
                </div>
                <asp:Button ID="btnMP1Show" runat="server" Text="Show MP1" style="display:none"/>
                <asp:Panel ID="Panel1" runat="server" CssClass="panel001">
                    <asp:Button ID="btnMP3OK" runat="server" Text="Return" OnClick="btnMP3OK_Click"/>
                    <asp:Button ID="btnMP3Manual" runat="server" Text="Manual" OnClick="btnMP3Manual_Click" />
                    <h1>Flight Operational Quality Assurance</h1>
                    <div style="overflow:auto; border: 1px solid black; width: 100%; height: 500px">
                        <%--<telerik:RadScriptManager runat="server" ID="RadScriptManager1"></telerik:RadScriptManager>--%>
                        <telerik:RadSkinManager runat="server" ID="RadSkinManager1" ShowChooser="true"></telerik:RadSkinManager>
                        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1"></telerik:RadAjaxManager>
                        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>
                        <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" ShowStatusBar="True" runat="server" AllowAutomaticInserts="True" AllowAutomaticUpdates="True" AllowFilteringByColumn="True" AllowSorting="True" AutoGenerateEditColumn="True" DataSourceID="ObjectDataSource1" EnableHeaderContextFilterMenu="True" EnableHeaderContextMenu="True" ShowFooter="True" ShowGroupPanel="True">
                            <PagerStyle Mode="NumericPages"></PagerStyle>
                            <GroupingSettings CollapseAllTooltip="Collapse all groups" />
                            <ClientSettings AllowDragToGroup="True" AllowKeyboardNavigation="true" EnablePostBackOnRowClick="true">
                                <Selecting AllowRowSelect="true"></Selecting>
                            </ClientSettings>
                            <MasterTableView EnableHierarchyExpandAll="true" AutoGenerateColumns="False" DataSourceID="ObjectDataSource1" AllowMultiColumnSorting="True">
                                <DetailTables>
                                    <telerik:GridTableView EnableHierarchyExpandAll="true" DataKeyNames="SectorKey" DataSourceID="ObjectDataSource2" Width="100%" runat="server">
                                        <ParentTableRelation>
                                            <telerik:GridRelationFields DetailKeyField="SectorKey" MasterKeyField="SectorKey"></telerik:GridRelationFields>
                                        </ParentTableRelation>
                                        <Columns>

//Confidential Code Hidden

                                        </Columns>
                                    </telerik:GridTableView>
                                </DetailTables>
                                <Columns>

// Confidential Code Hidden

                                </Columns>
                            </MasterTableView>
                            <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
                            <FilterMenu RenderMode="Lightweight">
                            </FilterMenu>
                            <HeaderContextMenu RenderMode="Lightweight">
                            </HeaderContextMenu>
                        </telerik:RadGrid>

                        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server"
//Confidnential Code Hidden
                        </asp:ObjectDataSource>
                    </div>
                </asp:Panel>
            </ContentTemplate>
        </asp:UpdatePanel>

    </div>
</asp:Content>

General Discussions

answered on 20 Mar 2017

0 answers

157 views

Server side button onclick does not trigger with RadAjaxManager

I am using several settings in RadAjaxManager. I have a server control asp button which re-loads the whole page when clicked. To prevent that I put this setting in RadAjaxManager

<telerik:AjaxSetting AjaxControlID="btnPrint">

</UpdatedControls></telerik:AjaxSetting>

but for some reason my code behind click event does not fire. Any ideas please

<asp:Button ID="btnPrint" runat="server" Text="Print" CssClass="button" OnClick="btnPrint_Click" ></asp:Button>

Ajax

asked on 20 Mar 2017

0 answers

91 views

dynamic grid sorting not working

Hi,

I have created a dynamic grid. but sorting not working.

here is my code.

aspx code

<telerik:RadGrid ID="radGridBICheckData" runat="server" SkinID="RadGrid">
<ClientSettings>
<Resizing EnableRealTimeResize="True" ResizeGridOnColumnResize="True" AllowColumnResize="True"
ClipCellContentOnResize="True" AllowResizeToFit="True"></Resizing>
</ClientSettings>
</telerik:RadGrid>

code behind

protected void Page_Init(object sender, EventArgs e)
{
try
{

DefineGridStructure();
}
catch (Exception ex)
{
Logger.Write(ex.Message, "Error", 0);
NISP.Utilities.ErrorPage.ErrorLog(ex);
}
}

private void DefineGridStructure()
{
//Defines the Grid structure
radGridBICheckData.AutoGenerateColumns = false;
radGridBICheckData.AllowMultiRowSelection = true;
radGridBICheckData.AllowFilteringByColumn = true;
radGridBICheckData.GridLines = GridLines.None;
radGridBICheckData.AllowSorting = true;
// radGridBICheckData.EnableViewState = true;
String htmlColor = "#EDEFF1";
Color backColor = ColorTranslator.FromHtml(htmlColor);
radGridBICheckData.AlternatingItemStyle.BackColor = backColor;
String editColor = "#A2A2A2";
Color editbackColor = ColorTranslator.FromHtml(editColor);
radGridBICheckData.MasterTableView.AllowSorting = true;
radGridBICheckData.MasterTableView.AllowCustomSorting = true;
radGridBICheckData.MasterTableView.AllowFilteringByColumn = true;
radGridBICheckData.MasterTableView.AllowPaging = true;
radGridBICheckData.MasterTableView.AllowCustomPaging = true;
// radGridBICheckData.MasterTableView.CanRetrieveAllData = true;
radGridBICheckData.MasterTableView.PagerStyle.AlwaysVisible = true;
radGridBICheckData.MasterTableView.PagerStyle.Position = GridPagerPosition.Bottom;
radGridBICheckData.MasterTableView.PagerStyle.Mode = GridPagerMode.NextPrevNumericAndAdvanced;
radGridBICheckData.ClientSettings.AllowKeyboardNavigation = true;
radGridBICheckData.ClientSettings.Selecting.AllowRowSelect = true;
radGridBICheckData.ClientSettings.Scrolling.AllowScroll = true;
radGridBICheckData.ClientSettings.Scrolling.UseStaticHeaders = true;
radGridBICheckData.ClientSettings.Scrolling.ScrollHeight = Unit.Pixel(390);
radGridBICheckData.FilterMenu.EnableTheming = true;
radGridBICheckData.FilterMenu.CollapseAnimation.Duration = 200;
radGridBICheckData.FilterMenu.CollapseAnimation.Type = AnimationType.OutQuint;
//Add Master table
radGridBICheckData.MasterTableView.Name = "BICheck";
string[] resolutionArr;
if (SessionManager.GetSessionObject("ScreenResolution") != null)
{
resolutionArr = SessionManager.GetSessionObject("ScreenResolution").ToString().Split('*');
ApplicaionResolutionSettings.ResizingGridForResolution(ApplicationConstants.RES_FILE_TEMPLATE_ROW_DEFINITION, resolutionArr, radGridBICheckData, ApplicationConstants.RES_POPUP_SINGLE_GRID);
}

radGridBICheckData.MasterTableView.EnableColumnsViewState = false;
//GridEditCommandColumn col1 = new GridEditCommandColumn();
//col1.ButtonType = GridButtonColumnType.ImageButton;
//col1.UpdateImageUrl = "../App_Themes/Default/Grid/Update.gif";
//col1.EditImageUrl = "../App_Themes/Default/Grid/Edit.gif";
//col1.InsertImageUrl = "../App_Themes/Default/Grid/Insert.gif";
//col1.CancelImageUrl = "../App_Themes/Default/Grid/Cancel.gif";
//col1.Visible = true;
//col1.UniqueName = "EditCommandColumn";
//grid.MasterTableView.Columns.Add(col1);
GridBoundColumn boundColumn;
string uniqueName = string.Empty;
for (int intIndex = 0; intIndex <= 20; intIndex++)
{
boundColumn = new GridBoundColumn();
if (intIndex == 0)
{
uniqueName = "STATUS";
boundColumn.AllowFiltering = false;
// boundColumn.AllowSorting = false;
}
else
{
uniqueName = "Value" + intIndex;
boundColumn.AllowFiltering = true;
// boundColumn.AllowSorting = true;
}

boundColumn.DataField = uniqueName;
boundColumn.HeaderText = "";
boundColumn.UniqueName = uniqueName;
boundColumn.SortExpression = uniqueName;
//boundColumn.AllowFiltering = true;
//boundColumn.AllowSorting = true;
boundColumn.HeaderStyle.Width = Unit.Pixel(120);
radGridBICheckData.MasterTableView.Columns.Add(boundColumn);
}
radGridBICheckData.NeedDataSource += new GridNeedDataSourceEventHandler(this.radGridBICheckData_NeedDataSource);
radGridBICheckData.ItemDataBound += new GridItemEventHandler(this.radGridBICheckData_ItemDataBound);
radGridBICheckData.ItemCommand += new GridCommandEventHandler(this.radGridBICheckData_ItemCommand);
// radGridBICheckData.PreRender += new EventHandler(radGridBICheckData_PreRender);
}

thanks in advance.

Grid

asked on 20 Mar 2017