asked on 11/9/2017

jQuery: encodeURI with a space

Hi can some say why the href with the space in doesn't do anything after the alert box show "My%20Word"
Did a var_dump of $_GET and nothing
Also nothing in the network tab of dev tools

$(document).on("click", "a", function(evt) {
     evt.preventDefault() ;
     var ID = "Wrap_" + $(this).attr('id');
     var link = encodeURI($(this).attr('href'));
     alert(link);
     $('#'+ ID).load(link);
});

<a href="myfile.php?param=My Word">My Word</a>
<a href="myfile.php?param=My word">MyWord</a>

Open in new window

jQuery

Last Comment

trevor1940

11/10/2017

SOLUTION

zephyr_hex (Megan)

11/9/2017

THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.

View this solution by signing up for a free trial.

Members can start a 7-Day free trial and enjoy unlimited access to the platform.

See Pricing Options

Start Free Trial

trevor1940

11/9/2017

ASKER

Apologies that was a typo

Just tried to recreate the issue at home and realised your 1/2 correct, the <a id='My Word'> is being created by php with a space which is causing the error

In the code bellow is it possible to load the response from myfile.php into the next div with class='resp'?
Yes I need to remove the id's

<html>
  <head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.js"></script>
    <script>
      
      $(document).on("click", "a", function(evt) {
     evt.preventDefault() ;
     var ID = "Wrap_" + $(this).attr('id');
     var link = encodeURI($(this).attr('href'));
     alert(link);
     $('#'+ ID).load(link);
});
    </script>
  </head>
  <body>
    <div>
      <a id="My Word" href="myfile.php?param=My Word">My Word</a>
      <div id='Wrap_My Word' class='resp'></div>
      <a id="MyWord" href="myfile.php?param=MyWord">MyWord</a>
      <div id='Wrap_MyWord' class='resp'></div>
      
    </div>
  </body>
</html>

Open in new window

zephyr_hex (Megan)

11/9/2017

I believe you may want to use an AJAX call for this, if I'm understanding your end goal. You want to get a response from myfile.php and output that response on the current page, right? Then AJAX would be the way to go. Make an AJAX call to myfile.php, and in the success callback of the AJAX call, use jQuery to add the response payload to your current page.

trevor1940

11/9/2017

ASKER

Maybe I'm not explaining my intention

When you make an AJAX call the response needs to go some place usually an HTML element with a unique id
Because the way the HTML is being constructed the ID's may have a space in it eg <div id='Wrap_My Word'> which is invalid

Instead of loading the AJAX response into $('#Wrap_My Word').load(link); which fails due to the space

How do I locate the next sibling, I think it's called, <div class='resp'></div> this is immediately after the 'clicked' anchor

ASKER CERTIFIED SOLUTION

Chris Stanyon

11/9/2017

THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.

View this solution by signing up for a free trial.

Members can start a 7-Day free trial and enjoy unlimited access to the platform.

See Pricing Options

Start Free Trial

trevor1940

11/10/2017

ASKER

Thannx Chris