Avatar of trevor1940
trevor1940
 asked on

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

Avatar of undefined
Last Comment
trevor1940

8/22/2022 - Mon
SOLUTION
zephyr_hex (Megan)

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
trevor1940

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)

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

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
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck
ASKER CERTIFIED SOLUTION
Chris Stanyon

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
trevor1940

ASKER
Thannx Chris