Question

0

123

Views

Convert a checkbox value into a live url when checked

I am creating a form where the visitor chooses items they wish to see by clicking relevant checkboxes. At this time I have the url's of the items as the value of the checkbox and these appear when clicking a Request button.

I would like the url that appears to be live (a href etc), so they just need to click on the link as opposed to copying and pasting into a browser address.
If possible I would like to have the checkbox value to be the item, which then converts to the url onClick. This is so that a right click will not show the url which will be in a separate java file.
This is not urgent, but eventually the results will be imported into a csv/excel file at the site as opposed to sending the results as an email.

Any help would be greatly appreciated.

    function displayResult() {
    var se = document.getElementById("myEmailList"),
        send = document.getElementById("send"),
        x = document.getElementById("mySelect"),
        l = [],
        list = x.querySelectorAll(":checked");
        
    for (i = 0; i < list.length; i++) {
        l.push(list[i].value);
        

        var fn = document.getElementById('item_1').value;
        document.getElementById('links').value = 'https://example.com';

        var fn = document.getElementById('item_2').value;
        document.getElementById('links').value = 'https://bbc.co.uk';

        var fn = document.getElementById('item_3').value;
        document.getElementById('links').value = 'https://google.com';

        var fn = document.getElementById('item_4').value;
        document.getElementById('links').value = 'https://itv.com';
    }

    send.href = "mailto:" + l.join(", <br>");
    se.innerHTML = l.join(", <br>");
}

<form>
  Select items required:
  <fieldset id="mySelect">
    <input type="checkbox" id="item_1" name="item_1" value="item_1">
    Item 1 <br>
    <input type="checkbox" id="item_2" name="item_2" value="item_2">
    Item 2 <br>
    <input type="checkbox" id="item_3" name="item_3" value="item_3">
    Item 3 <br>
    <input type="checkbox" id="item_4" name="item_4" value="item_4">
    Item 4 <br>
  </fieldset>

<button type="button" onClick="displayResult()">Request</button>
<a id="send" href="mailto:">Send email</a>


<div id="myEmailList"> 
<br><br>

<textarea id="links" style="width:300px; "type="text" rows="4"></textarea>

about 4 years ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-06T18:34:11.907Z

So, you want the form to send the user to the relevant places?

<form>Select your place:
<fieldset id="mySelect">
    <input type="checkbox" value="https://www.bbc.co.uk"><a href="https://www.bbc.co.uk">Item 1</a>
    <br>
    <input type="checkbox" value="https://google.com"><a href="https://www.google.com">Item 2</a>
    <br>
    <input type="checkbox" value="email3@domain.com"><a href="mailto: email3@domain.com">Item 3</a>
    <br>
    <input type="checkbox" value="email4@domain.com"><a href="mailto: email4@domain.com">Item 4</a>
    <br>
</fieldset>
... 
</form>

0

123

Convert a checkbox value into a live url when checked

1 answers

0

Find remote jobs

Andres GPT