How to check if url has no query string in jQuery?

Question

I am editing a form in WordPress. I want my jquery script to execute when the url has no query string.

The url should not have a query string like this: http://127.0.0.1/mybetabizopi/login/?action=lostpassword

I only want my script to run when the url is like this or has no query string: http://127.0.0.1/mybetabizopi/login/

This is my current script:

var j = jQuery.noConflict();
j(function() {


    j('#login #user_login').attr('placeholder', 'Username');
    j('#login #user_pass').attr('placeholder', 'Password');

    j('#login #user_login').addClass('form-control');
    j('#login #user_pass').addClass('form-control');

    j('#login #loginform label').wrap( "<div class='input-group'></div>" );


    j('#login .form-control').each(function() {
        j(this).insertAfter(j(this).parent());
    });

    j('#loginform .input-group > label').remove();

    j('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></span>').insertBefore('#user_login');

    j('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></span>').insertBefore('#user_pass');


});

Any help is appreciated.

please check this answer (by Felix Kling): stackoverflow.com/a/5817566/4287861 — Ran Hassid
– Ran Hassid, Commented Jul 18, 2016 at 8:35
This blog post could be useful: jquery-howto.blogspot.co.uk/2009/09/… — ymas
– ymas, Commented Jul 18, 2016 at 8:37
@RanHassid that's for getting the URL without the querystring, not checking if there is a querystring — Rory McCrossan
– Rory McCrossan, Commented Jul 18, 2016 at 8:39

Rory McCrossan · Accepted Answer · 2016-07-18 08:38:33Z

You can use indexOf on the window.location.href to check if there is a ? character.

Note that you can name the jQuery instance provided to the document.ready handler as you need, so you can still use the $ variable within that function scope, even through the global $ no longer points to jQuery. Also, you can make your jQuery code more efficient by caching and re-using your selectors. Try this:

jQuery(function($) {
  if (window.location.href.indexOf('?') == -1) { // no querystring exists
    $('#login #user_login').attr('placeholder', 'Username').addClass('form-control');
    $('#login #user_pass').attr('placeholder', 'Password').addClass('form-control');

    $('#login #loginform label').wrap("<div class='input-group'></div>");

    $('#login .form-control').each(function() {
      $(this).insertAfter($(this).parent());
    });

    $('#loginform .input-group > label').remove();

    $('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></span>').insertBefore('#user_login');
    $('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></span>').insertBefore('#user_pass');
  }
});

Alok Patel · Accepted Answer · 2016-07-18 08:38:55Z

2

You can do it using search property of location object.

var querystring=window.location.search;
alert(querystring);

It will return the query string of URL, Use it to check if URL has query string or not, and execute the jQuery code only if it's blank.

Like this,

if(querystring=="") {
    // Execute jQuery code.
}

answered Jul 18, 2016 at 8:38

Alok Patel

8,0726 gold badges35 silver badges48 bronze badges

1 Comment

Adrian Over a year ago

You should be a senior developer. Thank you sir

Poiz · Accepted Answer · 2016-07-18 08:40:27Z

You could simply use Javascripts location.search for that purpose like so:

        <script type="text/javascript">
            var j = jQuery.noConflict();
            j(function() {

                var hasQuery    = (location.search && location.search != undefined)?true : false;
                if(!hasQuery){

                    j('#login #user_login').attr('placeholder', 'Username');
                    j('#login #user_pass').attr('placeholder', 'Password');                 
                    j('#login #user_login').addClass('form-control');
                    j('#login #user_pass').addClass('form-control');                    
                    j('#login #loginform label').wrap( "<div class='input-group'></div>" );


                    j('#login .form-control').each(function() {
                        j(this).insertAfter(j(this).parent());
                    });

                    j('#loginform .input-group > label').remove();

                    j('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></span>').insertBefore('#user_login');

                    j('<span class="input-group-addon" id="basic-addon1"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></span>').insertBefore('#user_pass');                 
                }               
            });
        </script>

Dotnetpickles · Accepted Answer · 2016-07-18 08:41:21Z

1

Hi use below function to check whether querystring exist or not

function checkQueryStringExists()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    if(hashes.length>0)
        return true;
    else 
    return false;
}

answered Jul 18, 2016 at 8:41

Dotnetpickles

1,0248 silver badges13 bronze badges

Collectives™ on Stack Overflow

How to check if url has no query string in jQuery?

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related