PHPackages                             analyzer666/jquery-ajax-enx-bundle - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating & Views](/categories/templating)
4. /
5. analyzer666/jquery-ajax-enx-bundle

ActiveSymfony-bundle[Templating & Views](/categories/templating)

analyzer666/jquery-ajax-enx-bundle
==================================

This bundle provides a Twig functions that generate js function to send ajax request.

v1.1(12y ago)165MITPHPPHP >=5.3.0

Since Feb 19Pushed 8y ago1 watchersCompare

[ Source](https://github.com/analyzer666/JQueryAjaxEnxBundle)[ Packagist](https://packagist.org/packages/analyzer666/jquery-ajax-enx-bundle)[ RSS](/packages/analyzer666-jquery-ajax-enx-bundle/feed)WikiDiscussions master Synced 4w ago

READMEChangelogDependencies (1)Versions (2)Used By (0)

JQueryAjaxBundleEnx for Symfony2. fork of mabs/jquery-ajax-bundle

Install
-------

[](#install)

To install this bundle on your project, add this line to composer.json file:

```
json
"analyzer666/jquery-ajax-bundle-enx": "dev-master"

```

How to use:

Prepare to use Ajax...

\###On client side:

1. Twig: Making some div which will show before ajax request is go on the server and will hiding after get respone:

     [![]({{ asset('bundles/app/images/ajax-loading.gif') }})]()
2. Twig: Adding div to update data. Content of this div will be replaced by returned data
3. CSS: Adding CSS styles to this div

    \#ajax-loading {
    position: fixed; z-index: 1000; top: 0; left: 0; height: 100%; width: 100%; background-color:#c5523f; opacity: .8; display: none; }

    .ajax-loader { position: absolute; left: 50%; top: 50%; margin-left: -32px; /\* -1 \* image width / 2 */ margin-top: -32px; /* -1 \* image height / 2 \*/ display: block;
    }

Thats all preparing for client side.

\###On server side:

1. Controller: Making controller to get response

    /\*\*

    - @Route("/gallery/get/galleries/{category\_id}", name="gallery\_renderGalleries") \*/ public function getGalleriesAction($category\_id = null) { $selectedCategory = $this->getDoctrine() ->getRepository('AppBundle:GalleryCategory') ->findOneById($category\_id) ; $galleries = $selectedCategory->getGalleries(); if (count($galleries)>1) { return $this->render( 'default/gallery/render\_galleries.html.twig', array( 'selectedCategory' => $selectedCategory, ) ); } elseif (count($galleries)==1) { return $this->getGalleryPhotosAction($galleries->first()->getId()); } }

Thats all for server part.

Lets use Ajax! Just insert into the twig this code:

```
{{ ja_link({
    'update': '#galleries',
    'url': url('gallery_renderGalleries', {'category_id':category.id}),
	'text': 'Gallery',
    'after': set_after,
	'loading': '#ajax-loading'
}) }}

```

this code get us working link to send ajax request.

```
PhotoGallery`

```

This wirking example of using this plagin.

This bundle add 3 Twig functions:

\##1 - ja\_request:

To generate a js code to send an ajax request:

1. twig

    {{ ja\_request({'update': '#reponse', 'url': path('new') }) }}

or

```
{{ ja_request({
	'update': '#reponse',
    'url': path('new'),
    'after': 'alert("after");',
    'before': 'alert("before");',
    'complete': 'alert("complete");'  })
}}

```

=> html

```
$.ajax({
    url: "/app_dev.php/new",
	type: "POST",
    dataType: "html",
    beforeSend: function(){alert("before");},
    success: function( data ){$( "#reponse" ).html(data);alert("after");}
});

```

Options for jQuery ajax request:

```
*    -$options['type']			: type: '...'; default - POST
*    -$options['dataType']      : dataType: '$dataType'; default - html
*    +$options['url']           : url: "..."
*    -$options['before']        : beforeSend: function(){"..."}
*    +$options['update']        : success: function( data ){"...").html(data)
*    -$options['after']         : adding to the end of success:
*    -$options['complete']      : complete: function(){"..."}
*    -$options['loading']       : div id to show and hideand hide

```

\##2 - ja\_link:

To generate a link:

twig

```
{{ ja_link({'update': '#reponse', 'url': path('new'), 'text': 'new link'  }) }}`

```

To add a confirm action on click, you just have to use 'confirm': true, by default the text is "Are you sure you want to perform this action?" then if you want to replace it, use 'confirm\_msg': "\*\*\*".

You can also use those parameters 'before' and 'after' to execute JS code. Lets upderstand all options:

Options for link (/) element:

```
*   -$options['confirm']        : true-false:
*   -$options['confirm_msg']    : message to confirm ajax request
*   -$options['class']          :