Как скопировать данные формы?

Question

У меня есть этот код, который работает, но жестко запрограммирован.

$(document).ready(function(){
    $('form').live('submit', function(){

    var title      = this.elements.title.value;
    var owner      = this.elements.owner.value;
    var users      = this.elements.users.value;
    var groups     = this.elements.groups.value;
    var begin_date = this.elements.from.value;
    var end_date   = this.elements.to.value;
    var anchor     = this.elements.anchor.value;
    var type = $(this).find('input:radio[name="ctype"]:checked').val() || '';

    var aform      = $('form[name="create_form"]');

Мне нужно aform для вложенного вызова Ajax позже.

Вопрос

Как мне построить aform, чтобы он не был жестко запрограммирован? На странице много форм.

Он должен содержать

    var title      = this.elements.title.value;
    var owner      = this.elements.owner.value;
    var users      = this.elements.users.value;
    var groups     = this.elements.groups.value;
    var begin_date = this.elements.from.value;
    var end_date   = this.elements.to.value;
    var anchor     = this.elements.anchor.value;
    var type = $(this).find('input:radio[name="ctype"]:checked').val() || '';

и должен работать с вложенным вызовом Ajax позже.

$.ajax({
    type: "GET",
    url: "/cgi-bin/ajax.pl",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: aform.serialize(),

Answer 1

Вот простой пример преобразования некоторых элементов формы в объект JSON - хотя предложение Абдул Кадера лучше, если вы хотите сделать это только для отправки данных в формате JSON.

<form method="post" action="" id="example">
    <p><label>Name<br><input type="text" name="name" value="Bob"></p>
    <p><label>Happy<br><input type="checkbox" name="happy" checked></p>
    <p><textarea name="information">Some text "data" here!</textarea>
</form>
<div id="exampleOutput">

</div>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">

    function exampleFormData() {
        var formData;
        var jsonString = "({";
        var jsonCount = 0;

        // This will add each input to a JSON string
        $("#example input, #example textarea").each( function () {
            if (jsonCount > 0) {
                jsonString += ", "
            }
            var key = this.name;
            var value = this.value;
            jsonString += key + ': "' + value.replace(/"/g, '\\"') + '"';
            jsonCount++;
        });
        jsonString += "})"

        // This converts the string into a JSON object
        formData = eval(jsonString);

        // Now you can use the formData JSON object...
        $("#exampleOutput").html(formData.name + " " + formData.happy + " " + formData.information);
    }

    exampleFormData();
</script>

Answer 2

var aform = $(this);

(по запросу Сандры: -)

Answer 3

Вам не нужно делать все это самостоятельно.Сам Jquery имеет плагин формы , который отправляет форму через ajax.Это само за себя.