...

View Full Version : Very Basic Question, using user entry, please help?



bojomojo
04-24-2008, 04:11 PM
I need to get an entry from the user and then add it to a url in a link <a href>
How can that be done?

Kor
04-24-2008, 04:19 PM
Could be something like this:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
var defaultHref;
function changeLink(v){
document.getElementById('mylink').href=defaultHref+v;
}
onload=function(){
defaultHref=document.getElementById('mylink').href;
}
</script>
</head>
<body>
<form>
<input type="text" onkeyup="changeLink(this.value)" onblur="changeLink(this.value)">
</form>
<a href="http://google.com" id="mylink">mylink</a>
</body>
</html>

bojomojo
04-24-2008, 04:33 PM
it is working, thank you for your great help

bojomojo
04-24-2008, 04:43 PM
i have 2 more questions:

1. I need to add something to the link after the user entry

2. I want to hide that code so that noone can see it when they read the source

abduraooft
04-24-2008, 04:58 PM
2. I want to hide that code so that noone can see it when they read the source
http://www.codingforums.com/showthread.php?p=182173#post182173

bojomojo
04-24-2008, 05:10 PM
okay, but cant i use it in php so that its not viewd

Kor
04-24-2008, 05:10 PM
I want to hide that code so that noone can see it when they read the source
Sure, why not?:rolleyes: As easy as a perpetuum mobile:D

No way, pard, you can not hide (at least not for a medium skilled programmer) client-side codes (HTML, CSS, Javascrip):cool:

Kor
04-24-2008, 05:13 PM
okay, but cant i use it in php so that its not viewd
In this case you must submit the value to a php application which will add the value to a link written in that php application and will open the new page.

But, as long as the user will go anyway on that page, why to hide it's link? On the other hand, as a user, if you invite me to open a link but I don't see the url in my status bar, I refuse to click, as I suspect that you try to cheat me or drive me where I don't like (phishing sites, poisoned sites... and so on)

bojomojo
04-24-2008, 05:17 PM
no, i dont want to hide the link, i want to hide the process itself, can you tell me how to do that php thing

Kor
04-24-2008, 05:27 PM
no, i dont want to hide the link, i want to hide the process itself, can you tell me how to do that php thing
What process? You add a value (which is known, as the user input it) to a url (which is known, as you can see it when you roll over the link). What's so special in it to hide it? :rolleyes: A php solution makes no difference: the same known value added to the same known url. Nothing to be hide, nothing can be hide... I don't get it. What is your final aim, after all?

bojomojo
04-24-2008, 05:38 PM
yes that it true i found the technique so simply but it took some time, so i dont want other people to just copy the technique

bojomojo
04-24-2008, 05:42 PM
how can i add a value after the part that the user input
for exacmple the user puts google
and i want it to be google.com

mjlorbet
04-24-2008, 06:03 PM
<script type = "text/javascript">
var mystery_element = "<?= your_php_var ?>";
</script>
...
kor's technique here excepting add mystery_element to the value
you're assigning to the href of your link
...

bojomojo
04-24-2008, 06:05 PM
sorry i dont understand fully

mjlorbet
04-24-2008, 06:22 PM
you said you wanted to use php, so that which creates the code for this page would be your php file. it's pretty simple



<?
//Your secret ingredients here (so that noone knows what's in the special sauce)
//ultimately resulting in the aptly named variable $the_special_sauce
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
var defaultHref;
var mystery_element = "<?= $the_special_sauce ?>";
function changeLink(v){
document.getElementById('mylink').href=defaultHref+v+mystery_element;
}
onload=function(){
defaultHref=document.getElementById('mylink').href;
}
</script>
</head>
<body>
<form>
<input type="text" onkeyup="changeLink(this.value)" onblur="changeLink(this.value)">
</form>
<a href="http://google.com" id="mylink">mylink</a>
</body>
</html>


if you are, however, talking about posting data asynchronously to your php page to have some process executed on it so it can be returned to the calling function and appended to the link, methinks you should look into a little ajax

bojomojo
04-24-2008, 06:41 PM
i just want the new link, but i want it to appear as if somework has been done, you know what i mean, I need that after the user inputs the data and click submit, it loads another page with the new link

if it can be like after the user clicks submit it makes a little loading animation and then by ajax displaying the link, that would be great, how can i do that?

BTW, what i want to hide is that i add the user input to a certain url, you know i dont want users just typing the url and adding the part themselves, that will cut the website revenue

mjlorbet
04-24-2008, 07:03 PM
document.getElementById("your_wait_img_id").style.display="block";
window.status = "Server contacted, waiting for response...";
setTimeout(function(){
var temp = document.createElement("a");
temp.href = v+users_href;
temp.innerHTML = users_href;
document.body.appendChild(temp);
window.status = "Done";
document.getElementById("your_wait_img_id").style.display="none";
setTimeout(function(){window.status = "";}, 1000);
}, 3000);


didn't test it, didn't really even try that hard (the effect's easy enough, but the status changes might not work), as i disagree with this practice, but i think this is what you're shooting for instead of just reassigning the href of the existing link.

the reason i disagree is that users don't like to wait, making it seem like you've done some long drawn out process isn't going to impress someone who just came to your site. actually it may even be likely that it will give them enough slight discomfort to leave... so....

bojomojo
04-24-2008, 07:06 PM
I just want it to display loading for a second, or the other option view the link on a new page.
I know i am a pain in the ***
but can you post the complete code that does either of them??

And the important thing is that i want to place the JS part that contains the code that adds the part the user puts to the link in php tags to not be viewed by members who view the source (if possible)

and also hide the link if it can be done

mjlorbet
04-24-2008, 07:20 PM
wasn't criticizing, just saying i wouldn't do it myself.

i think it would be best to consider what you want to do with it. the model you're describing is like this

collect the name of the link
post to an external php page
transform the name of the link into a link itself
generate a whole new page around it
flush the new page
user uses new page

as opposed to something much more simple like:
collect the name of the link
dynamically create a new link
put the link on the page

the second method requires less time, no browser refresh and doesn't have any need for an ajax detect script (if you decide to do the top method without reloading the page but wanted the extra delay from an additional request).

if you're just trying to get around the "view source" people, just put your js in an external file and use <script type="text/javascript" src="yourfile.js"></script> in your code, that way the people trying to find your code would have to open your file, extract the link to the file and download it seperately instead of just copying the source directly from your html. the advantage to this is that people (if they're anything like me), when they open a page to inspect the source of it, are far too lazy in general to go through the trouble of, viewing the source, locating the script tag, getting the src property, pathing that within the url, saving the file, locating it, and opening it. if it involves more than 2 steps... people probably aren't going to bother with going through with stealing it from you.

mjlorbet
04-24-2008, 07:25 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
var defaultHref;
function changeLink(v){
document.getElementById("your_wait_img_id").style.display="block";
window.status = "Server contacted, waiting for response...";
setTimeout("function(t){
var temp = document.createElement("a");
temp.href = defaultHref + t;
temp.innerHTML = users_href;
document.body.appendChild(temp);
window.status = "Done";
document.getElementById("your_wait_img_id").style.display="none";
setTimeout(function(){window.status = "";}(" + v + ")", 1000);
}, 1000);}
onload=function(){
defaultHref=document.getElementById('mylink').href;
}
</script>
</head>
<body>
<form>
<input type="text" onkeyup="changeLink(this.value)" onblur="changeLink(this.value)">
</form>
<a href="http://google.com" id="mylink">mylink</a>
</body>
</html>


something like that.... i need to finally realize that editing code in this little window can sometimes not work so well ;)

this one would append the link to the same window btw.

bojomojo
04-24-2008, 07:30 PM
I like the second model but i want it like that

Collect the link
Make a loading img for a second
Display the modified link

and yes i want it to be in an external file, how can i do that??

I just wanted to use php to hide the process

bojomojo
04-24-2008, 07:33 PM
1 There is a script errorm
I want the link to appear after the user clicks on submit or something like that


can it be done like i mentioned in my last post?

mjlorbet
04-24-2008, 08:23 PM
linkscript.js

var defaultHref;
function changeLink(v){
document.getElementById("your_wait_img_id").style.display="block";
window.status = "Server contacted, waiting for response...";
setTimeout("function(t){
var temp = document.createElement("a");
temp.href = defaultHref + t;
temp.innerHTML = users_href;
document.body.appendChild(temp);
window.status = "Done";
document.getElementById("waitimg").style.display="none";
setTimeout(function(){window.status = "";}(" + v + ")", 1000);
}, 1000);}
onload=function(){
defaultHref=document.getElementById('mylink').href;
}


index.html


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" src="linkscript.js">
</script>
</head>
<body>
<form>
<input type="text" id="linkhref" />
<input type="button" onclick="changeLink(document.getElementById('linkhref').value);" />
</form>
<a href="http://google.com" id="mylink">mylink</a>
<img src="loading.jpg" id="waitimg" style="display:none; position:absolute; top:0px; left:0px; z-index:45;" />
</body>
</html>


what is the script error, like i've said, i've not tested the code

bojomojo
04-24-2008, 08:47 PM
it just says a script error and doesnt work, here is the link

http://mp4j.awardspace.com/

if possiblle i want the link to appear after the click on the button

mjlorbet
04-24-2008, 09:21 PM
quotes were blocking, the actual error message is "unterminated string constant: line 6", always check the error details (in ie, double click on the warning sign by where it says Script error)


var defaultHref;
function changeLink(v){
document.getElementById("your_wait_img_id").style.display="block";
window.status = "Server contacted, waiting for response...";
setTimeout('function(t){var temp = document.createElement("a");temp.href = defaultHref + t;temp.innerHTML = users_href;document.body.appendChild(temp); window.status = "Done"; document.getElementById("waitimg").style.display="none"; setTimeout(function(){window.status = "";}, 1000);}(' + v + ')', 1000);}
onload=function(){
defaultHref=document.getElementById('mylink').href;
}

bojomojo
04-24-2008, 09:27 PM
Error, Line 4 object required

Can the link not be visible untill the bottom is clicked?!?

mjlorbet
04-24-2008, 10:04 PM
yeah, remove the code for the link, the new ones will be generated when the button is clicked anyways

mjlorbet
04-24-2008, 10:07 PM
var defaultHref;
function mkLnk(t){
var temp = document.createElement("a");
temp.href = defaultHref + t;
temp.innerHTML = users_href;
document.body.appendChild(temp);
window.status = "Done";
document.getElementById("waitimg").style.display="none";
setTimeout(function(){window.status = "";}, 1000);
}
function changeLink(v){
document.getElementById("waitimg").style.display="block";
window.status = "Server contacted, waiting for response...";
setTimeout(function(){mkLnk(v);}, 1000);
}



change linkscript.js to this, should be easier to troubleshoot
side note, give your button a value so that it says something, not just a little blank sliver of a button

<input type="button" ... value="Create link" />

bojomojo
04-24-2008, 10:19 PM
the link is not changed after i click on the button, it gives an error:
Line 6
Char 2
users_href undefined

and how can i change the location of the image, "i still have to add it"

mjlorbet
04-24-2008, 10:21 PM
inside the image tag, the src attribute to match whatever your image is.

users_href should be either v or t depending on what function it is in

Kor
04-25-2008, 09:37 AM
window.status = ""

Anyway (fortunately) thus trick woun't work in Firefox, so that about 20-25% of the users will be still able to see the real link in the status bar :rolleyes:

mjlorbet
04-25-2008, 11:15 AM
yeah, the status wasn't for the link, the op wants to make it seem as though there was a complicated process to creating the link, so it's intended to make the status bar look as though it's requesting. i don't think that opera will work with the status bar either.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum