From d205a64d8a5493b1ddc0b0a792b1da2e3ff91b84 Mon Sep 17 00:00:00 2001 From: KB Bot Date: Thu, 10 Jul 2025 11:05:13 +0000 Subject: [PATCH 1/4] Added new kb article rename-move-preview-button-html5-asp-net-report-viewer --- ...view-button-html5-asp-net-report-viewer.md | 68 +++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md diff --git a/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md new file mode 100644 index 000000000..4a9385a30 --- /dev/null +++ b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md @@ -0,0 +1,68 @@ +--- +title: Renaming and Repositioning Preview Button in HTML5 ASP.NET Web Forms Report Viewer +description: Learn how to rename and move the Preview button in the parameters section of the HTML5 ASP.NET Web Forms Report Viewer. +type: how-to +page_title: Changing and Moving the Preview Button in HTML5 ASP.NET Report Viewer +meta_title: Changing and Moving the Preview Button in HTML5 ASP.NET Report Viewer +slug: rename-move-preview-button-html5-asp-net-report-viewer +tags: html5, reportviewer, preview-button, parameters, localization +res_type: kb +ticketid: 1690422 +--- + +## Environment + + + + + + + + + + + + +
Product Progress® Telerik® Reporting
Version 16.2.22.1109
+ +## Description + +I want to rename the Preview button in the HTML5 ASP.NET Web Forms Report Viewer to match my custom requirements. Additionally, I want to reposition the Preview button to the top of the parameters area instead of its default position at the bottom. + +This knowledge base article also answers the following questions: +- How to change the Preview button text in Telerik Reporting? +- How to move the Preview button to the top of the parameters section? +- How to customize the Preview button in HTML5 ASP.NET Report Viewer? + +## Solution + +### Renaming the Preview Button + +1. Locate the `telerikReportViewer.stringResources-16.2.22.1109.js` file in the installation folder: + `C:\Program Files (x86)\Progress\Telerik Reporting \Html5\ReportViewer\js`. + +2. Open the file and replace the `parametersAreaPreviewButton: "Preview"` value with your desired button name. + +3. Copy the updated `.js` file to your project's `Scripts` folder. If the folder doesn't exist, create one. + +4. Reference the updated script in the `.aspx` file before the `telerikReportViewer` script. For example: + ```html + + + ``` + +5. If the changes don't reflect, replace the entire content of the `stringResources` file with the localization snippet from [Localization of the HTML5 ReportViewer](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization). + +6. Compile and run your project to verify the updated button name. + +### Moving the Preview Button to the Top + +1. Follow the instructions provided in [Move Preview Button at the Top of Parameters Area](https://docs.telerik.com/reporting/knowledge-base/how-to-move-preview-button-at-the-top-of-parameters-area). + +2. Implement the required changes to reposition the Preview button within your project. + +## See Also + +- [Localization of the HTML5 ReportViewer](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization) +- [Move Preview Button at the Top of Parameters Area](https://docs.telerik.com/reporting/knowledge-base/how-to-move-preview-button-at-the-top-of-parameters-area) +- [HTML5 ReportViewer Overview](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/overview) From 9edd34ebe1a4b788930c22ae62dd1848d445c481 Mon Sep 17 00:00:00 2001 From: IvetNikolova <118352332+IvetNikolova@users.noreply.github.com> Date: Thu, 10 Jul 2025 14:24:23 +0300 Subject: [PATCH 2/4] Update rename-move-preview-button-html5-asp-net-report-viewer.md --- ...view-button-html5-asp-net-report-viewer.md | 51 ++++++++----------- 1 file changed, 21 insertions(+), 30 deletions(-) diff --git a/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md index 4a9385a30..19e28bd6f 100644 --- a/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md +++ b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md @@ -13,56 +13,47 @@ ticketid: 1690422 ## Environment - - - - - - - - - - + + + + + + + + + +
Product Progress® Telerik® Reporting
Version 16.2.22.1109
Product Progress® Telerik® Reporting
Version 16.2.22.1109
## Description I want to rename the Preview button in the HTML5 ASP.NET Web Forms Report Viewer to match my custom requirements. Additionally, I want to reposition the Preview button to the top of the parameters area instead of its default position at the bottom. -This knowledge base article also answers the following questions: -- How to change the Preview button text in Telerik Reporting? -- How to move the Preview button to the top of the parameters section? -- How to customize the Preview button in HTML5 ASP.NET Report Viewer? - ## Solution ### Renaming the Preview Button -1. Locate the `telerikReportViewer.stringResources-16.2.22.1109.js` file in the installation folder: +1. Locate the `telerikReportViewer.stringResources-19.1.25.521.js` file in the installation folder: `C:\Program Files (x86)\Progress\Telerik Reporting \Html5\ReportViewer\js`. -2. Open the file and replace the `parametersAreaPreviewButton: "Preview"` value with your desired button name. +1. Open the file and replace the `parametersAreaPreviewButton: "Preview"` value with your desired button name. + +1. Copy the updated `.js` file to your project's `Scripts` folder. If the folder doesn't exist, create one. -3. Copy the updated `.js` file to your project's `Scripts` folder. If the folder doesn't exist, create one. +![Script Folder in WebForms.png](images/ScriptFolderWebForms.png) -4. Reference the updated script in the `.aspx` file before the `telerikReportViewer` script. For example: +1. Reference the updated script in the `.aspx` file before the `telerikReportViewer` script. For example: ```html - + ``` -5. If the changes don't reflect, replace the entire content of the `stringResources` file with the localization snippet from [Localization of the HTML5 ReportViewer](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization). +1. If the changes don't reflect, replace the entire content of the `stringResources` file with the localization snippet from [Localization of the HTML5 ReportViewer]({%slug telerikreporting/using-reports-in-applications/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization%}). -6. Compile and run your project to verify the updated button name. +1. Compile and run your project to verify the updated button name. ### Moving the Preview Button to the Top -1. Follow the instructions provided in [Move Preview Button at the Top of Parameters Area](https://docs.telerik.com/reporting/knowledge-base/how-to-move-preview-button-at-the-top-of-parameters-area). - -2. Implement the required changes to reposition the Preview button within your project. - -## See Also +1. Follow the instructions provided in [Move Preview Button at the Top of Parameters Area]({%slug how-to-move-preview-button-at-the-top-of-parameters-area%}). -- [Localization of the HTML5 ReportViewer](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization) -- [Move Preview Button at the Top of Parameters Area](https://docs.telerik.com/reporting/knowledge-base/how-to-move-preview-button-at-the-top-of-parameters-area) -- [HTML5 ReportViewer Overview](https://docs.telerik.com/reporting/embedding-reports/display-reports-in-applications/web-application/html5-report-viewer/overview) +1. Implement the required changes to reposition the Preview button within your project. From b7f7bcedcfd990e5f8f6b1f04e73393c9dcd8d1b Mon Sep 17 00:00:00 2001 From: IvetNikolova <118352332+IvetNikolova@users.noreply.github.com> Date: Thu, 10 Jul 2025 14:27:21 +0300 Subject: [PATCH 3/4] Add files via upload --- knowledge-base/images/ScriptFolderWebForms.png | Bin 0 -> 7738 bytes 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 knowledge-base/images/ScriptFolderWebForms.png diff --git a/knowledge-base/images/ScriptFolderWebForms.png b/knowledge-base/images/ScriptFolderWebForms.png new file mode 100644 index 0000000000000000000000000000000000000000..6b92d83047e5780b506ca53ed0088c24a3bc81b6 GIT binary patch literal 7738 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 literal 0 HcmV?d00001 From 6260059ca4b851e7608c24b76951bf27505392de Mon Sep 17 00:00:00 2001 From: Dimitar Nikolov Date: Wed, 16 Jul 2025 18:08:51 +0300 Subject: [PATCH 4/4] Update rename-move-preview-button-html5-asp-net-report-viewer.md --- ...view-button-html5-asp-net-report-viewer.md | 54 +++++++++++-------- 1 file changed, 33 insertions(+), 21 deletions(-) diff --git a/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md index 19e28bd6f..60e7a9d30 100644 --- a/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md +++ b/knowledge-base/rename-move-preview-button-html5-asp-net-report-viewer.md @@ -1,9 +1,9 @@ --- -title: Renaming and Repositioning Preview Button in HTML5 ASP.NET Web Forms Report Viewer -description: Learn how to rename and move the Preview button in the parameters section of the HTML5 ASP.NET Web Forms Report Viewer. +title: Renaming and Repositioning Preview Button in HTML5-based Report Viewers +description: "Learn how to rename and move the Preview button in the parameters section of the HTML5-based Report Viewers." type: how-to -page_title: Changing and Moving the Preview Button in HTML5 ASP.NET Report Viewer -meta_title: Changing and Moving the Preview Button in HTML5 ASP.NET Report Viewer +page_title: Changing and Moving the Preview Button in HTML5 Report Viewer +meta_title: Changing and Moving the Preview Button in HTML5 Report Viewer slug: rename-move-preview-button-html5-asp-net-report-viewer tags: html5, reportviewer, preview-button, parameters, localization res_type: kb @@ -19,41 +19,53 @@ ticketid: 1690422 Progress® Telerik® Reporting - Version - 16.2.22.1109 + Viewer + HTML5-based Report Viewers ## Description -I want to rename the Preview button in the HTML5 ASP.NET Web Forms Report Viewer to match my custom requirements. Additionally, I want to reposition the Preview button to the top of the parameters area instead of its default position at the bottom. +I want to rename the **Preview** button in the HTML5 Report Viewer or one of its wrappers to match my custom requirements. Additionally, I want to reposition the **Preview** button to the top of the parameters area instead of its default position at the bottom. ## Solution ### Renaming the Preview Button -1. Locate the `telerikReportViewer.stringResources-19.1.25.521.js` file in the installation folder: - `C:\Program Files (x86)\Progress\Telerik Reporting \Html5\ReportViewer\js`. - +1. Locate the `telerikReportViewer.stringResources-{{site.buildversion}}.js` file in the installation folder - `C:\Program Files (x86)\Progress\Telerik Reporting {{site.suiteversion}}\Html5\ReportViewer\js`. 1. Open the file and replace the `parametersAreaPreviewButton: "Preview"` value with your desired button name. +1. Copy the updated `telerikReportViewer.stringResources-{{site.buildversion}}.js` file to your project's `Scripts` folder(*or any folder that you provide local files from such as __wwwroot__*). -1. Copy the updated `.js` file to your project's `Scripts` folder. If the folder doesn't exist, create one. - -![Script Folder in WebForms.png](images/ScriptFolderWebForms.png) + ![The stringResource script file placed in a local directory inside the project](images/ScriptFolderWebForms.png) -1. Reference the updated script in the `.aspx` file before the `telerikReportViewer` script. For example: - ```html - - - ``` +1. Reference the updated script file on the page with the HTML5-based Report Viewer before the `telerikReportViewer` script. For example: + + ````HTML + + +```` -1. If the changes don't reflect, replace the entire content of the `stringResources` file with the localization snippet from [Localization of the HTML5 ReportViewer]({%slug telerikreporting/using-reports-in-applications/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization%}). 1. Compile and run your project to verify the updated button name. ### Moving the Preview Button to the Top -1. Follow the instructions provided in [Move Preview Button at the Top of Parameters Area]({%slug how-to-move-preview-button-at-the-top-of-parameters-area%}). +Use the followig CSS to move the **Preview** button to the top of the parameters area: + +````CSS + .trv-parameters-area.preview .trv-parameters-area-footer { + top: 0; + } + + .trv-report-viewer .trv-parameters-area.preview .trv-parameters-area-content { + top: 3em; + bottom: 0; + } +```` + + +## See Also -1. Implement the required changes to reposition the Preview button within your project. +* [Localization of the HTML5 Report Viewers]({%slug telerikreporting/using-reports-in-applications/display-reports-in-applications/web-application/html5-report-viewer/customizing/localization%}) +* [Move Preview Button at the Top of Parameters Area]({%slug how-to-move-preview-button-at-the-top-of-parameters-area%})