Jquery - Send only some value from a form

Question

Hi. I have this code :

<form onSubmit="return checkTL();" method='POST' action='./index.php?general=example3' name='addtl' >
    <div class="sideon" id="sideline0">
        <input type="text" id="inputside0" name="sides[]" class="inputTLS" maxlength="50" />
    </div>

    <div class="sideoff" id="sideline1">
        <input type="text" id="inputside1" name="sides[]" class="inputTLS" maxlength="50" />
    </div>

    <div class="sideoff" id="sideline2">
        <input type="text" id="inputside2" name="sides[]" class="inputTLS" maxlength="50" />
    </div>

    <div class="sideon" id="sideline3">
        <input type="text" id="inputside3" name="sides[]" class="inputTLS" maxlength="50" />
    </div>    

    <input type="submit" value="Send" name="submit" />
</form>

using the checkTL() function, i need to send to the server (for example) only the input value into div with class "sideon". So, in the example, i need to get (server side) only the value of inputside0 and inputside3. How is possible this? cheers

Answer 1

How about using AJAX?

<form method="POST" action="./index.php?general=example3" name="addtl">
    ...
</form>

and then:

$(function() {
    $('form[name=addtl]').submit(function() {
        var dataToPost = $(this).find('.sideon :input').serialize();
        $.post(this.action, dataToPost, function(result) {
            alert('success');    
        });
        return false;
    });
});

Of course putting input fields whose values shouldn't be submitted to the server into a form is doubtful. Maybe you should rethink the way you organize the forms.

Answer 2

two ways:

1. make them into lots of seperate forms.
2. do return false on the form submit in jquery and use $(".sideon").find('input').val(); to post an ajax query