Solved

Onchange Split text appendTo text and join back together

Posted on 2010-11-10
4
375 Views
Last Modified: 2012-05-10
Hi guys!
I would like to append a value to href element of an achor from select box, after selecting one of its elements.

I would like to append it to the &B=two
So after selecting one of elements value of href is
"A=one&B=two&(selectedOptionValue)&path=somePath"

I am using jquery library, but don't mind using regular javascript with this task.

I will be very greatfull for any help!

Thanks!
<select onchange="appendToAnchor">

<option value="c=three">option1</option>

<option value="c=four">option2</option>

<option value="c=five">option3</option>

</select>

<a href="?A=one&b=two&path=somePath">go</a>

Open in new window

0
Comment
Question by:vidda22
  • 2
4 Comments
 
LVL 16

Accepted Solution

by:
jmatix earned 400 total points
ID: 34102240
1. Add an ids to <select> and <a>

<select id="sel1" onchange="appendToAnchor()">
<option value="c=three">option1</option>
<option value="c=four">option2</option>
<option value="c=five">option3</option>
</select>
<a href="?A=one&b=two&path=somePath">go</a>
 
<a id="anchor1" href="?A=one&b=two&path=somePath">go</a>

2. Define JS function appendToAnchor()

function appendToAnchor()
{
    var op = document.getElementById('sel1').value;
    document.getElementById('anchor1').href = document.getElementById('anchor1').href.replace(/&b=two/i, "&b=two&"+op);

}
0
 
LVL 3

Assisted Solution

by:kolakanuru1
kolakanuru1 earned 100 total points
ID: 34102354
mark up

        <select onchange="appendToAnchor(this.value)">
<option value="c=three">option1</option>
<option value="c=four">option2</option>
<option value="c=five">option3</option>
</select>
<a href="?A=one&b=two&#path=somePath" id="aTag" >go</a>

javascript
    function appendToAnchor(e)
    {
      var lnk = document.getElementById("aTag").href;
      lnk = lnk.replace("#path",e);
      document.getElementById("aTag").href = lnk

    }


just created an ID for anchor tag to easily identify the anchor tag and used #path instead of path to easily identify the string.
0
 
LVL 3

Expert Comment

by:kolakanuru1
ID: 34102392
I guess you need to replace somepath with selected value...little change

        <select onchange="appendToAnchor(this.value)">
<option value="c=three">option1</option>
<option value="c=four">option2</option>
<option value="c=five">option3</option>
</select>
<a href="?A=one&b=two&path=#somePath" id="aTag" >go</a>

javascript
    function appendToAnchor(e)
    {
      var lnk = document.getElementById("aTag").href;
      lnk = lnk.replace("#somepath",e);
      document.getElementById("aTag").href = lnk

    }
0
 

Author Closing Comment

by:vidda22
ID: 34102762
That was what I was looking for many thanks!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

947 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now