Merge pull request #2 from Sridhar-Karunakaran/master

Updating Read me file content

Author: ManiRam94

README.md

@@ -1,8 +1,87 @@
-# Save and load report through the toolbar in javascript pivotview component
-A quick-start project that demonstrates how to save and load reports in the Syncfusion Javascript Pivotview component using the toolbar.
+# 📊 Save & Load Reports in JavaScript PivotView Component
 
-# Project prerequisites
-Make sure that you have the compatible versions of Visual Studio Code in your machine before starting to work on this project.
+[![License](https://img.shields.io/badge/license-SEE%20LICENSE-blue.svg)](https://www.syncfusion.com/content/downloads/syncfusion_license.pdf) [![JavaScript](https://img.shields.io/badge/JavaScript-ES5-F7DF1E.svg)](https://developer.mozilla.org/en-US/docs/Web/JavaScript) [![Syncfusion EJ2](https://img.shields.io/badge/Syncfusion%20EJ2-Latest-0078D4.svg)](https://www.syncfusion.com/)
 
-# How to run this application
-To run this application, you first need to clone the [Save-and-load-report-through-the-toolbar-in-javascript-pivotview-component](https://github.com/SyncfusionExamples/save-and-load-report-through-the-toolbar-in-javascript-pivotview-component) repository and then open it in Visual Studio Code. Now, run the index.html in web browser, it will render the Essential JS 2 pivot table control.
+> **Production-ready example demonstrating toolbar-based report persistence in Syncfusion Essential JS 2 PivotView** — save and restore pivot table configurations with seamless localStorage integration and web-standards compliance.
+
+## 🎯 Overview
+
+This repository provides a complete, production-ready implementation for **saving and loading pivot table reports** using Syncfusion's Essential JS 2 PivotView component. Whether building business intelligence dashboards, financial reporting tools, or analytics applications, this example demonstrates modern patterns for persistent pivot table configuration management.
+
+### ✨ Key Features
+
+- ✅ **Save Reports**: Persist pivot table configurations through intuitive toolbar buttons
+- ✅ **Load Reports**: Restore saved configurations with single-click operation
+- ✅ **Toolbar Integration**: Seamless report management UI within EJ2 toolbar
+- ✅ **Syncfusion EJ2**: Leverages robust, feature-rich PivotView component
+- ✅ **Web Standards**: Pure HTML, CSS, and JavaScript—zero framework dependencies
+- ✅ **Browser Compatible**: Works across Chrome, Firefox, Safari, and Edge
+- ✅ **Quick Start**: Minimal setup with working example included
+
+## 🛠 Prerequisites & Requirements
+
+- **Web Browser**: Chrome, Firefox, Safari, or Edge (latest versions)
+- **Text Editor**: Visual Studio Code or similar
+- **Live Server**: Optional—enables quick development preview
+- **JavaScript Knowledge**: Familiarity with ES5 and DOM manipulation
+- **Syncfusion License**: Community or commercial license for production use
+
+## 📦 Installation & Setup
+
+1. **Clone Repository**
+   ```bash
+   git clone https://github.com/SyncfusionExamples/save-and-load-report-through-the-toolbar-in-javascript-pivotview-component
+   cd save-and-load-report-through-the-toolbar-in-javascript-pivotview-component
+   ```
+
+2. **Verify Project Files**: Ensure presence of:
+   - `index.html` — Main application template
+   - `index.js` — PivotView configuration and report logic
+   - `index.css` — Component styling
+   - `es5-datasource.js` — Sample data source
+
+3. **Launch Application**
+   - Right-click `index.html` → "Open with Live Server"
+   - Or open directly in browser: `file:///path/to/index.html`
+
+## 🚀 Quick Start
+
+Once loaded:
+- **View Data**: Pivot table displays configured datasource
+- **Save Report**: Click toolbar "Save" button to persist current layout
+- **Load Report**: Select previously saved report from dropdown to restore
+- **Modify & Re-save**: Adjust pivot configuration and save as new report
+
+## 🗂 Project Structure
+
+```
+├── index.html          # Application template & PivotView markup
+├── index.js            # PivotView initialization & report management
+├── index.css           # Component styling & layout
+├── es5-datasource.js   # Sample JSON datasource
+└── README.md           # This file
+```
+
+## 🔧 Configuration & Customization
+
+**Save Report Button**: Captures current pivot configuration to local storage
+**Load Report Button**: Retrieves and applies saved configurations
+**Data Binding**: Modify `es5-datasource.js` to bind custom data sources
+**Styling**: Update `index.css` for branding and layout customization
+
+## 📚 Resources
+
+- [Syncfusion EJ2 PivotView Documentation](https://www.syncfusion.com/javascript-ui-controls/js-pivot-table)
+- [JavaScript MDN Documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/)
+- [localStorage API Guide](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)
+
+## 📄 License
+
+This project is licensed under the **Syncfusion Community License**. See [Syncfusion License](https://www.syncfusion.com/content/downloads/syncfusion_license.pdf) for details.
+
+## 🆘 Support
+
+For issues or questions:
+- 📧 Open an issue on GitHub
+- 💬 Visit Syncfusion support forums
+- 🌐 Check Syncfusion documentation