CODEWITHSUNDEEP
javascripturl
user1667178
user1667178

Reputation: 23

Changing URL output of User Input with JavaScript

I'm trying to build something simple here:

a user types into an input field a url eg. http://sharepoint.com/human-resources/usa/Lists/testList/EditForm.aspx?ID=666&Source=http%3A%2F%sharepoint.com

.. hits "submit", when the URL gets spit out as a link, changing into: https://sharepointusa.com/en-us/human-resources/usa/Lists/testList/EditForm.aspx?ID=666&Source=http%3A%2F%sharepoint.com

I've been trying unsuccessfully to just spit out the whole URL, losing parameters, so I need a new approach, what is an easy vanilla javascript to just replace http://sharepoint.com/ with https://sharepointusa.com/en-us/ and leave the rest of the URL?

thanks

EDIT: 2 great answers, thank you, I adapted the first answer to my original code, while I play around with the second answer to see how it compares!:

<a href="" id="link"></a><br>
<input type="text" id="userInput" value="Enter your text here"><br>
<input type="button" onclick="changeText2()" value="change text">
<script>
function changeText2()
{
  var input=document.getElementById('userInput').value;//gets the value entered by user
const updatedUrl = input.replace('http://sharepoint.com/', 'https://sharepointusa.com/en-us/');
    document.getElementById("link").href = updatedUrl;
    document.getElementById("link").innerHTML = updatedUrl;
    

}

</script>

Upvotes: 0

Views: 783

Answers (2)

flancast90
flancast90

Reputation: 111

It1 got it right before me! anyways, this is a more advanced representation of how to change it directly from the input fields.

<!DOCTYPE html>
    <html>
    <body>
    
    <input id="demo" value="http://sharepoint.com/human-resources/usa/Lists/testList/EditForm.aspx?ID=666&Source=http%3A%2F%sharepoint.com">
    
    <button onclick="myFunction()">Try it</button>
    
    <script>
    function myFunction() {
      var str = document.getElementById("demo").value; 
      var changed = str.replace("sharepoint", "sharepointusa");
      document.getElementById("demo").value = changed;
    }
    </script>
    
    </body>
    </html>

Upvotes: 1

lt1
lt1

Reputation: 781

if you have a variable containing the full original url

const url = 'http://sharepoint.com/human-resources/usa/Lists/testList/EditForm.aspx?ID=666&Source=http%3A%2F%sharepoint.com';

then you can just do

const updatedUrl = url.replace('http://sharepoint.com/', 'https://sharepointusa.com/en-us/');

and updatedUrl will have what you're asking for.

Upvotes: 1

Related Questions