CODEWITHSUNDEEP
javascriptphpforms
Samuël Visser
Samuël Visser

Reputation: 441

How to submit one form out of multiple with javascript

On my website I have a big list of all the letters people can view. For every letter there is a form which sends some data from the letter to the next page. What I want to do is to submit the form with a link, and not with a button. As far as I know, that is not possible with PHP. So i tried making what i want in Javascript. My programming experience in Javascript is litterly 0%. I need some help with this :)

This is the code I'm using:

<script type="text/javascript">
function submitform()
{
    document.forms["brief_weergeven"].submit();
}
</script>

<form id='brief_weergeven[]' action='<?php echo $main; ?>beveiligd/achterbanner/nieuwsbrief.php' method='POST'>
    <input type='hidden' name='nummer' value='<?php echo $brieven[0]; ?>'>
    <input type='hidden' name='datum_maand' value='<?php echo $maand_getal; ?>'>
    <input type='hidden' name='datum_jaar' value='<?php echo $jaar; ?>'>
    <a href="javascript: submitform()" class='button'>Nieuwsbrief <?php echo $brieven[0]; ?> (<?php echo $maand .' ' .$jaar; ?>)<BR></a>
</form>

This code runs for every letter. As you can see, I'm using a array to give all the forms a seperate ID. The only thing is that i have no idea how to let javascript know which forum i submitted.

How can I do this? Please remember that i know nothing about javascript, so please explain what you're doing in your answer.

Upvotes: 1

Views: 91

Answers (3)

Parag Tyagi
Parag Tyagi

Reputation: 8970

user574632 gave you a nice alternative. Still even want to use JavaScript you can try below.

Use the jQuery onclick method having the id attribute of the link as selector.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $("#submit_link").on("click", function(){
        var form = $(this);
        var url = form.attr("action");
        var data = form.serialize();
        $.post(url, data);
    });
});
</script>

<form id='brief_weergeven[]' action='<?php echo $main; ?>beveiligd/achterbanner/nieuwsbrief.php' method='POST'>
    <input type='hidden' name='nummer' value='<?php echo $brieven[0]; ?>'>
    <input type='hidden' name='datum_maand' value='<?php echo $maand_getal; ?>'>
    <input type='hidden' name='datum_jaar' value='<?php echo $jaar; ?>'>
    <a href="#" id="submit_link" class='button'>Nieuwsbrief <?php echo $brieven[0]; ?> (<?php echo $maand .' ' .$jaar; ?>)<BR></a>
</form>

Upvotes: 0

Steve
Steve

Reputation: 20469

You dont need javascript to do this, just use css to make your button look like a link:

Css:

button {
        border:none;
        padding:0;
        background: none;
        color: blue;
        text-decoration: underline;
        cursor: pointer;
    }

html:

<button type="submit">Submit</button>

Upvotes: 3

Gtopuria
Gtopuria

Reputation: 427

You can usedocument.getElementById('form-id') And event handler like this

var form = document.getElementById('your-form-id');
form.onsubmit = function(){
// code   
}

Upvotes: 0

Related Questions