Change URL Attribute & Encode URL

[rbush]

I have a link that sends the contents of a couple divs to a website to fill out a form. I want to also encode this link but I am not sure exactly how to set that up.

Here are the divs...

<div class="info_line" id="msg_reason" name="msg_reason">
 <span class="title" id="reasonLabel">Reason: </span><span id="reasonType">Web-based E-mail sites are blocked</span>
</div>
<div class="info_line" id="msg_threat_source">
 <span class="title" id="siteLabel">Site: </span><span id="siteAddress">https://gmail.com/</span>
</div>

and the link...

<a href="https://myytown.org/index.php/create-new-request/new-support-request?new=yes&cat=Internet%20Access%20and%20Browsing&subcat=Access%20Denied%20Requests&reboot=no&subject=Please%20review%20this%20link%20for%20web%20filtering&eid=pontus" target="_blank" id="requestLink" onclick="changeLink();">Click Here to start your Support Ticket</a>

then my script that I have so far, it only applies the div contents to the link...

var reasonLabel = document.getElementById("reasonLabel").innerHTML;
var reasonType = document.getElementById("reasonType").innerHTML;
var siteLabel = document.getElementById("siteLabel").innerHTML;
var siteAddress = document.getElementById("siteAddress").innerHTML;
 
function changeLink() {
    var link = document.getElementById("requestLink");
    link.innerHTML = "Click Here to start your Support Ticket";
    link.setAttribute('href', "https://myytown.org/index.php/create-new-request/new-support-request?new=yes&cat=Internet%20Access%20and%20Browsing&subcat=Access%20Denied%20Requests&reboot=no&subject=Please%20review%20this%20link%20for%20web%20filtering&eid=pontus&details="+reasonLabel+reasonType+siteLabel+siteAddress);
 
}

I want to encode the : and the /, which I understand I need to use encodeURIComponent() to do.

Help please!

[Beverleyh]

Just trying to build up a picture of what you're trying to do and why you're doing it the way you are;

Why are you populating a form from the contents of divs? And then why are you trying to modify the URL on the fly with JavaScript? It seems very convoluted and inefficient.

Is there a reason why you cannot use a more "traditional" approach - form fields (hidden or otherwise) that submit the correct values and do not need further modification with javascript?

Maybe you can provide us with a demo so that we understand more of what you are trying to achieve?

[rbush]

Just trying to build up a picture of what you're trying to do and why you're doing it the way you are;

Why are you populating a form from the contents of divs? And then why are you trying to modify the URL on the fly with JavaScript? It seems very convoluted and inefficient.

Is there a reason why you cannot use a more "traditional" approach - form fields (hidden or otherwise) that submit the correct values and do not need further modification with javascript?

Maybe you can provide us with a demo so that we understand more of what you are trying to achieve?

So the page is for web policy violation (blocked websites at my office). There is a link on the page that creates a support request and fills out a form to send to IT to unblock the site. The div content changes depending on what type of site it is (email, shopping, religious...etc.) In order for IT to unblock the site they need the type of site and the site URL to be included in the support request. People are not including this on their own, so we need it to happen automatically when they click the link to create the support request.

The code I have now populates the fields just fine, but link needs to be encoded. (: and // need to be encoded)
This is the link being generated at this point: https://myytown.org/index.php/create...s://gmail.com/

I will attach screen shots for the pages I am dealing with.

[rbush]

Nevermind! I have solved it. Thanks for asking for more details.
Here is the script that I came up with:

var reasonLabel = encodeURIComponent(document.getElementById("reasonLabel").innerHTML);
var reasonType = encodeURIComponent(document.getElementById("reasonType").innerHTML);
var siteLabel = encodeURIComponent(document.getElementById("siteLabel").innerHTML);
var siteAddress = encodeURIComponent(document.getElementById("siteAddress").innerHTML);


function changeLink() {
    var link = document.getElementById("requestLink");
	link.innerHTML = "Click Here to start your Support Ticket";
    link.setAttribute('href', "https://myytown.org/index.php/create-new-request/new-support-request?new=yes&cat=Internet%20Access%20and%20Browsing&subcat=Access%20Denied%20Requests&reboot=no&subject=Please%20review%20this%20link%20for%20web%20filtering&eid=pontus&details="+reasonLabel+reasonType+siteLabel+siteAddress);

}