Question

I made a simple form with radio buttons and submit button. On submit, check() function is called and it prints out text dependent on which radio button is selected.

But, it only works when I submit for the second time. First time I sumbit, page refreshes, ?req=on is added in the url, and that’s it.

Why is that, and how can I get it to work every time I press the submit button?

HTML:

<form name="request" onsubmit="return check();">
    <p>
        <label>Pick fragments: </label>
    </p>
    <fieldset>
        <input id="rally" type="radio" name="req" />
        Longest rally
        <br />
        <input id="gamept" type="radio" name="req" />
        Game points
        <br />
        <input id="setpt" type="radio" name="req" />
        Set points
        <br />
        <br />
        <input type="submit" />
    </fieldset>
</form>

<ul id="uri"></ul>

And part of the script:

function check() {

    window.location.hash = "article6";
    var uri = new Array();
    var vid = new Array();
    $('#uri').empty();

    if($('#rally')[0].checked) {

        //get json with the longest rally and print it out
        $.getJSON('json/longRally.json', function(json) {
            for(var i = 0; i < json["results"]["bindings"].length; i++) {
                uri[i] = json["results"]["bindings"][i]["longRally"].value
                vid[i] = json["results"]["bindings"][i]["uriRally"].value

            };

            uri.sort(alphanum);
            vid.sort(alphanum);

            for(var i = 0; i < json["results"]["bindings"].length; i++) {
                $('#uri').append('<li><a href="' + vid[i] + '">' + uri[i] + '</a></li>');
            };
        });
    }   
}

Web is located here:

http://b-webdesign.com/multilab/Ver3.0/#article6

Answer 1

Add:

return false;

To the end of your function.