{"id":21880923,"url":"https://github.com/mustafakhaleddev/jquery-actions","last_synced_at":"2026-04-17T10:02:10.114Z","repository":{"id":57011947,"uuid":"248342961","full_name":"mustafakhaleddev/jquery-actions","owner":"mustafakhaleddev","description":null,"archived":false,"fork":false,"pushed_at":"2020-03-24T07:59:18.000Z","size":24,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-26T18:47:49.634Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mustafakhaleddev.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-18T21:06:12.000Z","updated_at":"2020-03-24T07:59:05.000Z","dependencies_parsed_at":"2022-08-21T15:10:44.710Z","dependency_job_id":null,"html_url":"https://github.com/mustafakhaleddev/jquery-actions","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafakhaleddev%2Fjquery-actions","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafakhaleddev%2Fjquery-actions/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafakhaleddev%2Fjquery-actions/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mustafakhaleddev%2Fjquery-actions/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mustafakhaleddev","download_url":"https://codeload.github.com/mustafakhaleddev/jquery-actions/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244890107,"owners_count":20527031,"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-11-28T09:16:58.803Z","updated_at":"2026-04-17T10:02:10.036Z","avatar_url":"https://github.com/mustafakhaleddev.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Turn jQuery into magic with php\n\n[![Latest Version on Packagist](https://img.shields.io/packagist/v/laravel-creative/jquery-actions.svg?style=flat-square)](https://packagist.org/packages/laravel-creative/jquery-actions)\n[![Build Status](https://img.shields.io/travis/laravel-creative/jquery-actions/master.svg?style=flat-square)](https://travis-ci.org/laravel-creative/jquery-actions)\n[![Quality Score](https://img.shields.io/scrutinizer/g/laravel-creative/jquery-actions.svg?style=flat-square)](https://scrutinizer-ci.com/g/laravel-creative/jquery-actions)\n[![Total Downloads](https://img.shields.io/packagist/dt/laravel-creative/jquery-actions.svg?style=flat-square)](https://packagist.org/packages/laravel-creative/jquery-actions)\n\nTired of jquery ajax ? and laravel blades , now all of those things has been turned into magic , with this creative package you can do all ajax stuff without writing any javascript code.\nalso if you want to write fast laravel function without routes or controllers you can do it , i told u its magic :)\n## Installation\n\nYou can install the package via composer:\n\n```bash\ncomposer require laravel-creative/jquery-actions\n```\n\n[jQuery Actions](#usage)  \n* [onClick()](#usage)  \n* [on()](#on)  \n* [static()](#static)  \n* [jqueryForm()](#form)  \n* [$options array](#options) \n  \n[JqueryHelpers](#jqueryhelpers)  \n* [append()](#append)  \n* [remove()](#remove)  \n* [hide()](#hide)  \n* [show()](#show)  \n* [html()](#html)  \n* [console()](#console)  \n* [alerts()](#alerts)  \n \n\n## requires\nThis package requires ``jquery\n                       and jquery-confirm``\n                       you can install by cdn\n ```html\n\u003clink rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css\"\u003e           \n\n\u003cscript src=\"https://code.jquery.com/jquery-3.4.1.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js\"\u003e\u003c/script\u003e\n```\n\n\u003ca name=\"usage\"/\u003e\n\n## Usage\n### jQuery Actions\nJquery actions is static class with ``facades`` you can use it on ``laravel blades`` to do the magic. \u003cbr\u003e\nall functions are based on jquery ajax and secured hashed urls , of course you can use your own ``routes``\n \n \u003ca name=\"usage\"/\u003e\n\n#### onClick()\n```php \nJqueryAction::onClick($function, $options = [])\n```\nwhen you use this function in blades like this and don`t forget to add ``@jqueryScripts`` blade directive in the end of your file after jquery scripts.\n```php\n\u003cbutton {{JqueryAction::onClick(function($request){ echo 'Hello'; })}}\u003eSay Hello\u003c/button\u003e\n```\nwhen the user click the ``Say Hello`` button , an ajax request will go to secured hashed url and the response will be ``Hello``\n\u003cbr\u003e\n* Ok Great , but i want to run the function from controller ?\n\u003cbr\u003e\nThen you have to mention the controller and the actions like this.\n```\n\u003cbutton {{JqueryAction::onClick('app\\Http\\Controllers\\HomeController@sayHello')}}\u003eSay Hello\u003c/button\u003e\n```\n \n* that`s awesome, but i want to use custom url\n\u003cbr\u003e\n\u003ca name=\"options\"/\u003e\n\nthen you can use ``$options`` array to make the magic.\n```php\n$options = [\n             'url'=\u003enull, //Ajax Request Url\n             'method'=\u003e'POST', //Ajax Request Method\n             'onetime'=\u003efalse, //Allow One Time Request to this secured url, only work with built in urls.\n             'jquerySuccessCallback'=\u003enull, //The callback when success response, you can write jquery codes here and use the data as response, or use JqueryHelpers\n             'jqueryErrorCallback'=\u003enull, //The callback when error response, you can write jquery codes here and use the data as response, or use JqueryHelpers\n             'onLoadCallback'=\u003enull, // The javascript call back when function started\n             'expires'=\u003e20 //Function Expires after 20 second , only work with built in urls.\n];\n```\n\nso for custom urls your code would be like this\n\n```html\n    \u003cbutton {{JqueryAction::onClick(null,[\n    'url'=\u003eroute('name'),\n    'method'=\u003e'POST'\n    ])}}\u003eSay Hello\u003c/button\u003e\n```\n\n\n* all methods work the same way as function and options\n\n\u003ca name=\"on\"/\u003e\n\n#### on()\n```php\nJqueryAction::on($attribute,$function,$options=[])\n```\nin javascript you can use ``$('#id').on('onmouseenter',function(e){})`` to run a method when mouse enter div with id  ``#id``\nyou can use the same with this package.\n```html\n    \u003cbutton {{JqueryAction::on('onmouseenter',null,[\n    'url'=\u003eroute('name'),\n    'method'=\u003e'POST'\n    ])}}\u003eSay Hello\u003c/button\u003e\n```\nwith all ``onClick()`` magic too. you can use all html attributes on the first parameter\n\u003ca name=\"static\"/\u003e\n\n\n#### static()\n```php\nJqueryAction::static($selector,$method,$function,$options=[])\n```\nYou can make your own static javascript function without inline tag method,\n \nin javascript you can use ``$('#id').on('hover',function(e){})`` to run a method when mouse hover a div with id  ``#id``\nyou can use the same with this method. its ajax too.\n\n```html\n{{JqueryAction::static('#id','hover',null,[\n    'url'=\u003eroute('name'),\n    'method'=\u003e'POST'\n    ])}}\n```\n\u003ca name=\"form\"/\u003e\n\n#### jqueryForm()\nyou can do the magic with forms too.\n\u003cbr\u003e\nstart your form tag\n```html\n  {{JqueryAction::jqueryForm(function (\\Illuminate\\Http\\Request $request){\n      $post=new \\App\\Post();\n    $post-\u003etext=$request-\u003etext;\n    $post-\u003euser_id=$request-\u003euser()-\u003eid;\n    $post-\u003esave();\n    return $post-\u003etext;\n},[\n    'onetime'=\u003efalse,\n    'expires'=\u003e1200,\n    'jquerySuccessCallback'=\u003e\\LaravelCreative\\JqueryAction\\Helpers\\JqueryHelper::append('#posts','\u003cli\u003e','New Post {data}','\u003c/li\u003e'),\n    'onLoadCallback'=\u003e\\LaravelCreative\\JqueryAction\\Helpers\\JqueryHelper::jqueryAlert('Loading','Form Is Sending...'),\n])}}\n```\nthen add your fields and close the form\n\n```html\n  {!! JqueryAction::closeForm() !!}\n```\n\u003ca name=\"jqueryhelpers\"/\u003e\n\n### JqueryHelpers\nYou saw those keys in ``$options`` array above \n```\n'jquerySuccessCallback'=\u003enull, //The callback when success response, you can write jquery codes here and use the data as response, or use JqueryHelpers\n'jqueryErrorCallback'=\u003enull, //The callback when error response, you can write jquery codes here and use the data as response, or use JqueryHelpers\n'onLoadCallback'=\u003enull,\n```\nhow can you use them.\n \u003cbr\u003e\n 1- you can use pure javascript or jquery functions as `text` instead of `null` to control the ajax response.\n```\n'jquerySuccessCallback'=\u003e'alert(\"success :\"+ data)', \n'jqueryErrorCallback'=\u003e'console.log(error.status)', \n'onLoadCallback'=\u003e'alert(\"loading..\")',\n```\n 2-or you can use our ``jqueryHelper`` functions.\n \u003ca name=\"append\"/\u003e\n\n#### append($selector, $openTag, $msg, $closedTag)\nuses jquery ``append`` function\n```\n'jquerySuccessCallback'=\u003ejqueryHelper::append(\"#status\",'\u003cp\u003e','Success Status : {data.status}','\u003c/p\u003e'), \n'jqueryErrorCallback'=\u003ejqueryHelper::append(\"#status\",'\u003cp\u003e','Error Status : {error.status}','\u003c/p\u003e'), \n'onLoadCallback'=\u003ejqueryHelper::append(\"#status\",'\u003cp\u003e','Loading....','\u003c/p\u003e'), \n```\nyou can use ``{data}`` to access javascript data object ``{data.msg}``\n\u003ca name=\"remove\"/\u003e\n\n#### remove($selector)\nuses jquery ``remove`` method to remove element \n```\n'jquerySuccessCallback'=\u003ejqueryHelper::remove(\"#loading\"),  \n```\n\u003ca name=\"hide\"/\u003e\n\n#### hide($selector)\n ```\n'jquerySuccessCallback'=\u003ejqueryHelper::hide(\"#loading\"),  \n```\n\n\u003ca name=\"show\"/\u003e\n\n#### show($selector)\n ```\n'onLoadCallback'=\u003ejqueryHelper::show(\"#loading\"),  \n```\n\n\u003ca name=\"html\"/\u003e\n\n#### html($selector,$msg)\nchange element html\n```\n'jquerySuccessCallback'=\u003ejqueryHelper::html(\"#msg\",'Success'),  \n```\n\u003ca name=\"console\"/\u003e\n\n#### console($msg)\nwrite to the console\n```\n'jquerySuccessCallback'=\u003ejqueryHelper::console('{data.users}'),  \n```\n#### static function function($selector, $function, $msg)\nthis would print `` $('$selector').$function('$msg');\"; ``\nfor example i want to change html of div when success.\n```\n'jquerySuccessCallback'=\u003ejqueryHelper::function('#text','html','{data.text}'),  \n```\nso the result would be\n```javascript\n$('#text').html(data.text);\n```\n\u003ca name=\"alerts\"/\u003e\n\n\n#### jqueryAlert($title, $msg)\nwe uses ``jquery confirm`` alerts to display alerts messages.\n ```\n'jqueryErrorCallback'=\u003ejqueryHelper::jqueryAlert(\"Error !\",\"cant reach : {error}\"),  \n```\n\n \n \n\n### Changelog\n\nPlease see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.\n\n## Contributing\n\nPlease see [CONTRIBUTING](CONTRIBUTING.md) for details.\n\n### Security\n\nIf you discover any security related issues, please email mustafakhaled.dev@gmail.com instead of using the issue tracker.\n\n## Credits\n\n- [Mustafa Khaled](https://github.com/laravel-creative)\n- [All Contributors](../../contributors)\n\n## License\n\nThe MIT License (MIT). Please see [License File](LICENSE.md) for more information.\n \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmustafakhaleddev%2Fjquery-actions","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmustafakhaleddev%2Fjquery-actions","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmustafakhaleddev%2Fjquery-actions/lists"}