# \[SOLVED\] Using routes in an external js file

**URL:** <https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782>\
**Category:** Questions\
**Created:** [August 31, 2017, 2:38pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782 "2017-08-31T14:38:18Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![meazy](https://avatars.discourse-cdn.com/v4/letter/m/f0a364/32.png) [@meazy](https://discourse.slimframework.com/u/meazy)\
**Post date:** [August 31, 2017, 2:38pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/1 "2017-08-31T14:38:18Z")

</div>

I am currently using ajax in a twig template. To call the url from ajax I am using a route. Here is the full ajax

```
        $.ajax({
        url: "{{ path_for('myfundrequest') }}",
        type: 'get',
        dataType: 'json'
        }).done(function (response) {
        var len = response.length;

        fund.empty();

        for (var i = 0; i < len; i++) {
        var fundNum = response[i][0];
        var fundName = response[i][1];

        fund.append("<option value='" + fundNum + "'>" + fundNum + ' -- ' + fundName + "</option>");
        }
        fund.prepend("<option value=''>- Select A Fund -</option>").val('');
        }).fail(function (jqXHR, textStatus, error) {
        console.log("getFund: " + error);
        });
        });

```

If I move this to an external js file in my public folder how do I still call this the route in the url?

```
url: "{{ path_for('myfundrequest') }}"

```

Here is what my route looks like

```
$app->get('/fundrequest', 'PoEntryController:fund')->setName('myfundrequest');
```

---

<div class="post-metadata">

**Author:** ![RikuS](https://avatars.discourse-cdn.com/v4/letter/r/f07891/32.png) [@RikuS](https://discourse.slimframework.com/u/RikuS)\
**Post date:** [August 31, 2017, 6:01pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/2 "2017-08-31T18:01:15Z")

</div>

There’s probably multiple ways to do this. One simple option could be using HTML data attributes to store the url and then pick it up with JS.

```
// HTML
<button class="btn" data-url="{{ path_for('route_name') }}">Do something</button>

// JS
var url = $('.btn').data('url');
```

---

<div class="post-metadata">

**Author:** ![meazy](https://avatars.discourse-cdn.com/v4/letter/m/f0a364/32.png) [@meazy](https://discourse.slimframework.com/u/meazy)\
**Post date:** [August 31, 2017, 6:44pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/3 "2017-08-31T18:44:52Z")

</div>

I actually got a good answer on stackoverflow. @jmatthesis said

Add the urls as global variables maybe on an global object

index.twig

```
<!-- [..] -->
<script>
     Url = {
               myfundrequest: "{{ path_for('myfundrequest') }}"
             };
</script>

```

and then later use Url.myfundrequest as the url in JavaScript

```
$.ajax({
         url: Url.myfundrequest,
     ..
```

---

<div class="post-metadata">

**Author:** ![kalvn](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.slimframework.com/kalvn/32/443_2.png) [@kalvn](https://discourse.slimframework.com/u/kalvn)\
**Post date:** [September 2, 2017, 5:15pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/4 "2017-09-02T17:15:07Z")

</div>

That’s indeed how I use to do it.

---

<div class="post-metadata">

**Author:** ![meazy](https://avatars.discourse-cdn.com/v4/letter/m/f0a364/32.png) [@meazy](https://discourse.slimframework.com/u/meazy)\
**Post date:** [September 13, 2017, 2:37pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/5 "2017-09-13T14:37:52Z")

</div>

How do you do it now?

---

<div class="post-metadata">

**Author:** ![kalvn](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.slimframework.com/kalvn/32/443_2.png) [@kalvn](https://discourse.slimframework.com/u/kalvn)\
**Post date:** [September 13, 2017, 9:23pm UTC](https://discourse.slimframework.com/t/solved-using-routes-in-an-external-js-file/1782/6 "2017-09-13T21:23:50Z")

</div>

Sorry I meant “how I usually do it” 🙂