We help IT Professionals succeed at work.

jQuery:  encodeURI with a space

trevor1940
trevor1940 asked
on
123 Views
Last Modified: 2017-11-10
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

Comment
Watch Question

CERTIFIED EXPERT
Top Expert 2010
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Author

Commented:
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

CERTIFIED EXPERT
Top Expert 2010

Commented:
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.

Author

Commented:
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
CERTIFIED EXPERT
Most Valuable Expert 2018
Distinguished Expert 2019
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Author

Commented:
Thannx Chris

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.