Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts

    How to replace "space" with %20

    Hello, I am new to the forum and hoping to find some quick assistance. I have been struggling to fix this issue for quite sometime. My code is below

    HTML / JAVASCRIPT
    Code:
    <html>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    http://www.w3.org/TR/html4/loose.dtd>
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head><title>Darkapec Movie Player</title>
    <script type="text/javascript" src="ss1.js">
    </script>
    </head>
    <body>
    <h1>Darkapec Movie Player</h1>
    <b>Video location  :<?php require("movies.php");?>
    <input type="button" onclick='ld()' value="Load" />
    <div id="id1"></div>
    <div id="nowt"></div>
        <script type="text/javascript">
        function ld(){
        document.write("<html><!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\"http\:\/\/www.w3.org\/TR\/html4\/loose.dtd><html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" xml:lang=\"en\" lang=\"en\"><head><title>Darkapec Movie Player</title><script type=\"text\/javascript\" src=\"ss1.js\"><\/script><script type=\"text\/javascript\" src=\"fun1.js\"><\/script><\/head><body><h1>Darkapec Movie Player<\/h1><br/><embed type=\"application/x-vlc-plugin\" name=\"video1\" id=\"vlc\"  autoplay=\"yes\"  loop=\"no\"   width=\"640\"  height=\"480\"  target=\"/movies/"+document.getElementById("id4").value+"\"/><div id=\"nowt\"></div><div id=\"id1\"></div><div id=\"id2\"></div><script type=\"text\/javascript\" src=\"fun1.js\"><\/script><br/><input type=\"button\" onclick='pl()' value=\"Play\" /><input type=\"button\" onclick=\'ps()\' value=\"Pause\" /><input type=\"button\" onclick=\'st()\' value=\"Stop\" /><input type=\"button\" onclick=\'vlc.audio.toggleMute()\' value=\"Mute\" /><br/><b>width  :</b><input type=\"text\" id=\"i1\"/><br/><b>height :</b><input type=\"text\" id=\"i2\"/><br/><input type=\"button\" onclick=\'aspectRatio()\' value=\"Adjust Screen\" />");
         }
        </script>
    <br/>
    </body>
    </html>
    Second page of code is all PHP
    Code:
    <?php
    $dir="/backup/Movies";
    ///$dir="C:/xampp/htdocs/php/backup/Movies";
    $files = array();
    if ($handle = opendir($dir)) {
    	while (false !== ($file = readdir($handle)))
    	{
    		if ($file != "." && $file != ".." && $file != "index.php" && $file != "New Movies" && $file != "Icons" && $file != "Tv Shows")
    		{
    			$files[] = $file;
    		}
    	}
    	closedir($handle);
    }
    sort($files)
    ?>
    <form action="listen.php" method="post" name="table">
    <select name="Movie" id="id4">
    <p>
    <?php
    	$tmp = array();
    	foreach ($files as $file) {
    		$tmp[] = "<option value='$file'>$file</option>";
    	}
    	echo implode("\n",$tmp) . "\n";
    ?>
    </p>
    </select>
    </form>
    Basically the php gives the javascript a list of movies located in my directory, I am able to successfully launch any movie not containing a "space." I changed the code a little bit to allow for a "text input" and manually typed the name of a movie with %20 instead of a space and it worked. So I would like to modify the above code to do this automatically without visibly changing the movie titles. I am not sure where I should change the code.

    Thanks in advance
    Jake
    Last edited by darkapec; 04-16-2011 at 01:48 AM.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,525
    Thanks
    80
    Thanked 4,490 Times in 4,454 Posts
    It would help a *LOT* if you would say WHERE the space is wrong.

    It *looks* to me like you mean here:
    Code:
    ... target=\"/movies/"+document.getElementById("id4").value+"\"/>...
    ???

    If so, the just change that to
    Code:
    ... target=\"/movies/"+escape(document.getElementById("id4").value)+"\"/>...
    If not, tell us where the problem is.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    darkapec (04-16-2011)

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,525
    Thanks
    80
    Thanked 4,490 Times in 4,454 Posts
    Note: If escape() doesn't work (it should), try encodeURIComponent( )
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    darkapec (04-16-2011)

  • #4
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts

    still not working

    First of all thank you very much for your reply. I tried both (escape() and encodeURIComponent()) both for whatever reason made my document.write output /movies/undefined as apposed to /movies/movietitle. If anyone has any other ideas I would be great full. In the mean time I will continue googling for the solution.

    yes I do believe the code in question is
    Code:
    ... target=\"/movies/"+document.getElementById("id4").value+"\"/>...
    Thanks again
    Jake
    Last edited by darkapec; 04-16-2011 at 11:40 AM.

  • #5
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by darkapec View Post
    First of all thank you very much for your reply. I tried both (escape() and encodeURIComponent()) both for whatever reason made my document.write output /movies/undefined as apposed to /movies/movietitle. If anyone has any other ideas I would be great full. In the mean time I will continue googling for the solution.

    yes I do believe the code in question is
    Code:
    ... target=\"/movies/"+document.getElementById("id4").value+"\"/>...
    Thanks again
    Jake
    both eacape and encodeURIComponent work, your problems is that 'id4' is the id of a select element, there is no value for select.

    http://www.javascriptkit.com/jsref/select.shtml

    use something like this:
    Code:
    var sel = document.getElementById("id4");
    
    ... target=\"/movies/"+ escape(sel.options[sel.selectedIndex]) +"\"/>...
    best regards

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,525
    Thanks
    80
    Thanked 4,490 Times in 4,454 Posts
    Doesn't make sense, oesxyl. How did the code work, at all, before he used escape().

    In any case, if you use sel.options[sel.selectedIndex] you will be getting an Option *object*.

    You need to get either the .value or the .text of the Option:
    Code:
    sel.options[sel.selectedIndex].value
    or
    sel.options[sel.selectedIndex].text
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    oesxyl (04-16-2011)

  • #7
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by Old Pedant View Post
    Doesn't make sense, oesxyl. How did the code work, at all, before he used escape().
    Code:
    <form action="listen.php" method="post" name="table">
    <select name="Movie" id="id4">
    <p>
    <?php
    	$tmp = array();
    	foreach ($files as $file) {
    		$tmp[] = "<option value='$file'>$file</option>";
    	}
    	echo implode("\n",$tmp) . "\n";
    ?>
    </p>
    </select>
    </form>
    this is the from op post #1 and is the reason why i jump to conclusion that using document.getElementById('id4').value doesn't work. How it work before i have no idea,

    In any case, if you use sel.options[sel.selectedIndex] you will be getting an Option *object*.

    You need to get either the .value or the .text of the Option:
    Code:
    sel.options[sel.selectedIndex].value
    or
    sel.options[sel.selectedIndex].text
    yes, you are right about object vs. value/text, is my fault. Thank you,

    best regards

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,525
    Thanks
    80
    Thanked 4,490 Times in 4,454 Posts
    But all modern browsers *DO* support getting the .value of a <select>.

    Basically, you can do document.someSelect.value and it is the equivalent of doing document.someSelect.options[document.someSelect.selectedIndex].value

    There were many browser back in the early days that did not support this, but MSIE introduced it (I think in MSIE 5) and current browsers all follow suit. Or at least all that I tested: MSIE, Firefox, Chrome.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    Quote Originally Posted by darkapec View Post
    I changed the code a little bit to allow for a "text input" and manually typed the name of a movie with %20 instead of a space and it worked. So I would like to modify the above code to do this automatically without visibly changing the movie titles. I am not sure where I should change the code.
    There are a few functions you can use to encode special characters in a url.

    I normally use encodeURI() unless I have to encode these chars as well - , / ? : @ & = + $ #. encodeURIcomponent() encodes these characters as well.

    Parameter values in $_GET and $_POST are automatically decoded when they are received by your php script.

  • #10
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts
    wow, some of this stuff is beyond my capabilities. Originally I had this
    Code:
    <b>Video location  :</b><input type="text" id="id4"/>
    that of course required me to type the name into the box and that did work. But it also would require the %20 to be typed in instead of spaces. This also caused problems because I did not know what file extension my movies had. So I thought using a php script to grab the name of the movies would eliminate the need for needing to know the file extension and that worked great. However I am still having the %20 issue. That should answer your questions about "how did it ever work before." The script still does work, wonder if there is a way to re incorporate the "id4" value? Then just use escape(). I understand the escape() I have used it in the past but I am unfamiliar with the rest of the suggestions.

    Thanks again for everyones help, hopefully I will get this figured out pretty soon.

  • #11
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,525
    Thanks
    80
    Thanked 4,490 Times in 4,454 Posts
    encodeURIComponent() is just a more complete version of escape().

    Handles more of the special character situations than escape() does.

    If escape() works for you, use it. If not, try encodeURIComponent().
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #12
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    Quote Originally Posted by darkapec View Post
    wow, some of this stuff is beyond my capabilities
    ...
    Thanks again for everyones help, hopefully I will get this figured out pretty soon.
    No problem

    So to summarise:

    If you need to just encode spaces and other special chars you can use encodeURI()

    If you need to encode additional chars , / ? : @ & = + $ # you can use encodeURIcomponent()

    If you need more help, just post back
    Last edited by bullant; 04-20-2011 at 12:41 AM.

  • #13
    New to the CF scene
    Join Date
    Apr 2011
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thanks again for all the suggestions, here is what I ended up doing
    Code:
    <script type="text/javascript">
       var a=document.getElementById("id6").value;
         var b=a.replace(/\s/g,"%20");
        function ld(){
        document.write("<html><!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\"http\:\/\/www.w3.org\/TR\/html4\/loose.dtd><html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\" xml:lang=\"en\" lang=\"en\"><head><title>Darkapec Movie Player</title><script type=\"text\/javascript\" src=\"ss1.js\"><\/script><script type=\"text\/javascript\" src=\"fun1.js\"><\/script><\/head><body><h1>Darkapec Movie Player<\/h1><br/><embed type=\"application/x-vlc-plugin\" name=\"video1\" id=\"vlc\"  autoplay=\"yes\"  loop=\"no\"   width=\"640\"  height=\"480\"  target=\""+b+"\"/><div id=\"nowt\"></div><div id=\"id1\"></div><div id=\"id2\"></div><script type=\"text\/javascript\" src=\"fun1.js\"><\/script><br/><input type=\"button\" onclick='pl()' value=\"Play\" /><input type=\"button\" onclick=\'ps()\' value=\"Pause\" /><input type=\"button\" onclick=\'st()\' value=\"Stop\" /><input type=\"button\" onclick=\'vlc.audio.toggleMute()\' value=\"Mute\" /><br/><b>width  :</b><input type=\"text\" id=\"i1\"/><br/><b>height :</b><input type=\"text\" id=\"i2\"/><br/><input type=\"button\" onclick=\'aspectRatio()\' value=\"Adjust Screen\" />");
         }
          </script>
    It just seemed to work the best. I kept running into issues with the escape().

    Now I am looking at how to set this up so load directories or load multiple directories and populate the list. But that question is more for a PHP forum.

    Thanks again guys for all your help I will definitely be back to this community.

  • #14
    Banned
    Join Date
    Feb 2011
    Posts
    2,699
    Thanks
    13
    Thanked 395 Times in 395 Posts
    no problem


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •