Question

177

Javascript - form select element open url in new window and submit form

rated 0 times [ 179] [ 2] / answers: 1 / hits: 44973 / 16 Years ago, thu, february 19, 2009, 12:00:00

UPDATED - please read further details below original question

I have a select form element with various urls, that I want to open in a new window when selected - to do this I have the following code in the element's onchange event:

window.open(this.options[this.selectedIndex].value,'_blank');

This works fine. But I also want to submit the form when changing this select element value - I've tried various things, but I can't seem to get it to work.

I have jquery, so if it's easier to achieve via that then that's fine.

Update - I've just realised there is another issue with the above, because some of the urls are actually used to generate and output pdfs, and these do not work - they open and then immediately close (at least in IE7).

UPDATE 07/05/09 - I've now opened a bounty for this question as I really need to come up with a working solution. I did originally get around the issue by displaying links instead of a form select element, but this is no longer feasible.

The reason I need the above is that I have a large number of files that might need to be viewed / printed, too many to reasonably display as a list of links. I need to submit the form to record the fact a particular file has been viewed / printed, then display a log of the file history on the form - I'm comfortable with achieving this side of things, so don't require assistance there, but I thought it would help to place the context.

So, to clarify my requirements - I need a form select element and 'View' button that when clicked will not only launch a file download in a new window (note the above issue I faced when these files were PDFs), but also submit the form that contains the select element.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kaleyv

Add To Favorites

Follow

Total Points: 259

Total Questions: 99

Total Answers: 107

Location: Saint Helena

Member since Tue, Nov 3, 2020

4 Years ago

kaleyv questions

1 How can I calculate the total price of products in a cart using JavaScript?

Sun, Jan 16, 22, 00:00, 2 Years ago

1 array.map() is returning elements all together in React JS

Thu, Dec 16, 21, 00:00, 2 Years ago

1 How do I reset mocked values in Jest?

Sat, Oct 24, 20, 00:00, 4 Years ago

1 NuxtJS: Disable console.log in production env

Sun, Oct 18, 20, 00:00, 4 Years ago

1 forwarding ref to react.FC gives type error: Property ref does not exist on type 'IntrinsicAttributes & Props & { children :? ReactNode}

Wed, Sep 16, 20, 00:00, 4 Years ago

View All

answered 16 Years ago nadiatristinl · Accepted Answer

Here ya go

<script type=text/javascript>

    $(function() {

        $(#selectElement).change(function() {

            if ($(this).val()) {

                window.open($(this).val(), '_blank');

                $(#formElement).submit();

            }

        });



        // just to be sure that it is submitting, remove this code

        $(#formElement).submit(function() {

            alert('submitting ... ');

        });

    });

</script>



<form id=formElement method=get action=#>

    <select id=selectElement>

        <option></option>

        <option value=http://www.deviantnation.com/>View Site 1</option>

        <option value=http://stackoverflow.com/>View Site 2</option>

        <option value=http://serverfault.com/>View Site 3</option>

    </select>

</form>