{"id":22420522,"url":"https://github.com/eniompw/ajaxflask","last_synced_at":"2026-01-06T10:47:22.750Z","repository":{"id":130003641,"uuid":"317527799","full_name":"eniompw/AJAXFlask","owner":"eniompw","description":"AJAX example using Python Flask","archived":false,"fork":false,"pushed_at":"2025-01-18T10:16:01.000Z","size":26,"stargazers_count":0,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-02-01T10:12:19.351Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/eniompw.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-12-01T12:02:57.000Z","updated_at":"2025-01-18T10:16:21.000Z","dependencies_parsed_at":null,"dependency_job_id":"8fe2d587-9534-48bd-836e-813ec0b54851","html_url":"https://github.com/eniompw/AJAXFlask","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eniompw%2FAJAXFlask","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eniompw%2FAJAXFlask/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eniompw%2FAJAXFlask/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eniompw%2FAJAXFlask/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/eniompw","download_url":"https://codeload.github.com/eniompw/AJAXFlask/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245785715,"owners_count":20671631,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-05T16:20:05.137Z","updated_at":"2026-01-06T10:47:22.722Z","avatar_url":"https://github.com/eniompw.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# AJAX Flask Examples\n\nThis repository demonstrates how to use AJAX with Flask through two examples using XMLHttpRequest (classic approach).\nFor a modern implementation using the Fetch API, see [Flask Fetch Examples](https://github.com/eniompw/FlaskFetch).\n\n## 1. Hello Name Example\nA simple interactive example that updates text without page reload.\n\n### Components:\n* Frontend: [`templates/ajax.html`](templates/ajax.html)\n  * Uses XMLHttpRequest to make AJAX calls\n  * Handles Enter key press for better UX\n  * Updates page content dynamically\n* Backend: [`flask_app.py`](flask_app.py)\n  * Simple Flask route that returns personalized greeting\n\n### Key Features:\n* Real-time updates without page refresh\n* Enter key support\n* Simple demonstration of GET parameters\n\n## 2. Stock Ticker Example\nAn automatic stock price updater for HSBC stock.\n\n### Components:\n* Frontend: [`templates/stock.html`](templates/stock.html)\n  * Auto-updates every 2 seconds\n  * Uses XMLHttpRequest for periodic updates\n* Backend: [`stock.py`](stock.py)\n  * Fetches real-time stock data from Yahoo Finance\n  * Parses and extracts current stock price\n\n### Key Features:\n* Automatic updates using setInterval\n* Real-time stock price data\n* Web scraping implementation\n\n## Technical Notes\n\n### AJAX Implementation:\n* Uses vanilla JavaScript XMLHttpRequest\n* No external JavaScript libraries required\n* Asynchronous updates without page reload\n\n### Frontend Tips:\n* `\u003cbutton\u003e` is used instead of `\u003cinput type=\"submit\"\u003e` for cleaner code\n* Forms are intentionally avoided to prevent page reloads\n* Event listeners handle both click and Enter key events\n\n### Backend Tips:\n* Flask routes handle AJAX requests\n* Request parameters accessed via `request.args`\n* Simple response handling\n\n## Setup and Running\n1. Install Flask: `pip install flask requests`\n2. Run either example:\n   * Hello Name: `python flask_app.py`\n   * Stock Ticker: `python stock.py`\n\n## Additional Resources\n* [More Dynamic Flask Examples](https://github.com/eniompw/DynamicFlask)\n\n## References\n* [W3Schools AJAX Tutorial](https://web.archive.org/web/20210607235923/https://www.w3schools.com/js/js_ajax_intro.asp)\n* [W3Schools Enter Key Events](https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_trigger_button_enter)\n* [W3Schools JavaScript Timing](https://www.w3schools.com/js/js_timing.asp)\n* [Flask Request Documentation](https://flask.palletsprojects.com/en/1.1.x/quickstart/#the-request-object)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feniompw%2Fajaxflask","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feniompw%2Fajaxflask","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feniompw%2Fajaxflask/lists"}