1

I'm trying to set a value for a dropdown list by clicking on a link(links to the same page), and the value that i want to set for the select is in the link.
I tried to do it this way, but because it is messed up it didn't work.
Here's the code i used: 

<html>
<body>
<select id="select">
<option value="one">Pen</option>
<option value="two">Paper</option>
<option value="three">Book</option>
</select>

<a class="link1" href="page.php?cc=three">Set select value</a>

<script> 
    function $_GET(param) {
        var vars = {};
            window.location.href.replace( location.hash, '' ).replace( 
                /[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
                function( m, key, value ) { // callback
                vars[key] = value !== undefined ? value : '';
                }
            );

        if ( param ) {
            return vars[param] ? vars[param] : null;    
        }
            return vars;
    }

    var cc = $_GET('cc');

    var elmnt = document.getElementsByClassName('link1'),
        selectClasse = document.getElementById('select');

            function setSelect () {
            for (var i = 0; i < elmnt.length; i++) {
                elmnt[i].onclick = function () {

                selectClasse.value = cc;
                    }
        window.history.pushState('Form', 'My form', this.getAttribute("href"));
        return false;
        };
    }
}
setSelect ();

</script>
</body>
</html>

Any help would be much appreciated.

Samwise
  • 111
  • 1
  • 9
  • So you want to click on an a tag and for this to set a value in a select? But you don't want it to trigger a page load? – Liam Mar 21 '16 at 13:37
  • I am missing some `` tags – Matthijs Mar 21 '16 at 13:37
  • Yes @Liam that is exactly what i'm trying to do! – Samwise Mar 21 '16 at 13:38
  • Let me know are you free to use any JQuery library to get the dropdown list ? – Ramkee Mar 21 '16 at 13:42
  • There is no need @Ramkee A vanilla Javascript solution is very straight forward. – Liam Mar 21 '16 at 13:42
  • Yes @Ramkee, i wouldn't mind using jQuery if it will give a solution to this. – Samwise Mar 21 '16 at 13:46
  • Fine, If you click on URL you should get the drop down list which are been returned by that URL. This is what i understood. Am i wrong ? – Ramkee Mar 21 '16 at 13:48
  • Possible duplicate of [How to get #hash value in a URL in JS](http://stackoverflow.com/questions/11920697/how-to-get-hash-value-in-a-url-in-js) – Liam Mar 21 '16 at 13:51
  • I've just noticed `#?cc=five` isn't a valid url!! Either use a querystring vlaue or a hash value. You can't mix them as you have – Liam Mar 21 '16 at 14:06
  • 1
    @Liam, i fixed it, there should be a page there `href="page.php?cc=five"` not a hash, sorry for that mistake. – Samwise Mar 21 '16 at 14:39
  • Yes @Ramkee, you are not wrong, that's what i'm trying to achieve! – Samwise Mar 21 '16 at 14:42

1 Answers1

0

If you want to do this with a link and its url parameters;

Based on the answer: https://stackoverflow.com/a/979996/2956448

So you can do it like;

var params = {};

if (location.search) {
var parts = location.search.substring(1).split('&');

for (var i = 0; i < parts.length; i++) {
    var nv = parts[i].split('=');
    if (!nv[0]) continue;
    params[nv[0]] = nv[1] || true;
}
}

var cc = params.cc;

var element = document.getElementById('select');
element.value = cc;
Community
  • 1
  • 1
gkonuralp
  • 463
  • 2
  • 11
  • 27