CODEWITHSUNDEEP
javascriptangularjs
Amb
Amb

Reputation: 3353

how to pass "question mark" in url javascript

In Angularjs app, i have a url like
http://url.com/my_app/#/store/items.
Now i want to append query string for example,
http://url.com/my_app/#/store/items?page=2.

but in url, javascript encodes the "?" to "%3F" which i don't want. It should remain "?" only in the url as angularjs $location.search() returns nothing for "%3F".

How it can be done ?

Upvotes: 42

Views: 32314

Answers (5)

pkozlowski.opensource
pkozlowski.opensource

Reputation: 117370

There is not enough details in your question so I will assume that you are using AngularJS routing - or at least the $location service - in non-HTML5 mode. If so, the part after the # character represents your URL from the single-page-application point of view (more about AngularJS here).

If the above assumptions are correct it means that you shouldn't try to add or manipulate the question mark "by hand". Instead you should change the search part of the $location to manipulate query string (part after ?) and the question mark will be added / removed to the final URL as needed.

In your case you could write:

$location.path('/store/items').search('page', 2)

This is assuming that you are manipulating URLs from JavaScript, as stated in your question.

Upvotes: 83

Debasish Mohapatra
Debasish Mohapatra

Reputation: 856

you can create a parameter object like:

var param = {
    page: 2
}
$location.url("/store/items").search(param)

Upvotes: 3

Knörpeltäng
Knörpeltäng

Reputation: 463

If you're using the ui-router which is highly recommended, you could use $state.go(to, params, options) as described here.

As prerequisite you need to define your state properly, that means every possible query parameter must be made known to the ui-router. See the following example (page and otherParam):

$stateProvider.
state('storeItems', {
  url: '/store/items?page&otherParam',
  templateUrl: '/modules/store/views/item.client.view.html'
});

And then you can just switch locations for instance from a controller by calling

$scope.gotoItemsPage = function(page) {
  $state.go('storeItems', {
    page: page,
    otherParam: 'Just a show off'
  });
};

No fiddling with the encoding needed and highly readable!

Upvotes: 1

toxaq
toxaq

Reputation: 6838

If you are using the $location service then use $location.url('/store/items?page=2') instead. This has been a setter method from at least 1.0.7 and works a treat in my 1.1.5 app.

Upvotes: 24

Iswanto San
Iswanto San

Reputation: 18569

You can use decodeURIComponent.

For example: 

decodeURIComponent('http://url.com/my_app/#/store/items%3Fpage=2');
// will give you `http://url.com/my_app/#/store/items?page=2`

Upvotes: -1

Related Questions