各种jQuery Ajax形成问题

I'm having all kinds of problems with getting my form to properly pass variables to my PHP file. Even if it does pass or seem to the final file doesn't seem to send. Where am I going wrong?

让我的表单正确地将变量传递给我的PHP文件时遇到各种各样的问题。即使它确实通过或似乎最终文件似乎没有发送。我哪里错了？

This is my contact form:

这是我的联系表格：

<form method="post">
    <div id="form_container">
        <div id="form_quote" action="">
            <input type="text" name="name" id="name" value="Name" title="Name"/>
            <input type="text" name="email" id="email" value="Email" title="Email"/>
            <input type="text" name="packages" id="packages" value="Packages" title="Packages" class="packages" />
            <!-- Package fields go here -->
            <input type="text" name="weight" id="weight" value="Total weight (kg)" title="Total weight (kg)" />
            <p class="ajaz"><input type="button" name="submit" id="submit" value="Request free callback" class="superbutton" /></p>
            <ul id="form_response"><li></li></ul>
        </div>
    </div>
</form>

I have a .change() event listener so that if the packages field changes (like say they want two packages) then two fields show up to allow more information to be added per package:

我有一个.change（）事件监听器，这样如果packages字段发生更改（比如说他们想要两个包），那么会显示两个字段以允许每个包添加更多信息：

$('.packages').change(function() {
    // alert('Handler for .change() called.'+$(this).val());
    $('.app').remove();

    // Get number of packages
    var packageNum = $(this).val();

    // Make sure packages is more than 0 and no greater than 10.
    if (packageNum>0 && packageNum <= 10) {
        // Add the table lines
        var newContent = $("<p class='app'>Please enter the height x width x length for each of your packages, in cm. If you are unsure of any please use your best guess. eg. 15 x 10 x 20</p><table class='app'><thead></thead><tbody></tr>");
        $(".packages").after(newContent);

        var current_number_of_rows = $('.app tbody tr').length;
        var number_of_requested_rows = packageNum;

        if(number_of_requested_rows <= 10 && number_of_requested_rows > 0){
            if(number_of_requested_rows > current_number_of_rows){
                while(current_number_of_rows++ < number_of_requested_rows){
                    $('.app tbody').append( '<tr><td><span>Package '+ current_number_of_rows +'</span>: <input type="text" name="packagedims[' + current_number_of_rows + ']" value="Dimensions" id="packagedims" title="Package '+ current_number_of_rows +'" /></td></tr>' );
                }
            }
            else{
                while(current_number_of_rows > number_of_requested_rows){
                    $('.app tbody tr').eq($('.app tbody tr').length - 1).remove();
                }
            }
        }
        $('.packages').append('</tr></tbody></table>');
    }
    else {
        alert('You can only choose a value from 1 to 10');
        $('.packages').val('Packages');
    }
});

Then I use Ajax to send the data to my PHP file:

然后我使用Ajax将数据发送到我的PHP文件：

jQuery('#form_quote input#submit').click(function() {
    jQuery('#form_quote p.ajaz').append('<img src="css/img/ajax-loader.gif" class="loaderIcon" alt="Loading..." />');

    var name = $('input#name').val();
    var email = $('input#email').val();
    var packages = $('input#packages').val();
    var packagedims = $('input#packagedims').serialize();
    var weight = $('input#weight').val();

    alert(packagedims + '&name=' + name + '&email=' + email + '&packages=' + packages +  '&weight=' + weight);

    jQuery.ajax({
        type: 'post',
        url: 'sendquote.php',

        // Serialize the form and post it to sendquote.php.
        data: 'name=' + name + '&email=' + email + '&packages=' + packages + /*'&packagedims=' +*/ packagedims + '&weight=' + weight,

        success: function(results) {
            jQuery('#form_quote img.loaderIcon').fadeOut(5000);
            jQuery('ul#form_response').html(results);
        }
    }); // end ajax
});

The problem seems to be at this stage because I just can't seem to get the right variable sent for packagedims

问题似乎是在这个阶段，因为我似乎无法获得为打包发送的正确变量

My PHP file is as follows.

我的PHP文件如下。

$name = trim($_POST['name']);
$email = $_POST['email'];
$packages = $_POST['packages'];
$packagedims = $_POST['packagedims'];
$weight = $_POST['weight'];

Packagedims just doesn't seem to be an array as I would expect, that is, packagedims[0]='something', packagedims[1]='something else'.

Packagedim似乎不像我期望的那样是一个数组，也就是packageims [0] ='something'，packagedims [1] ='其他'。

1 个解决方案

#1

Using the same ID on multiple elements is invalid!

在多个元素上使用相同的ID无效！

You should omit the id from:

你应该省略id：

$('.app tbody').append( '<tr><td><span>Package '+ current_number_of_rows +'</span>: <input type="text" name="packagedims[' + current_number_of_rows + ']" value="Dimensions" id="packagedims" title="Package '+ current_number_of_rows +'" /></td></tr>' );

It should be changed to:

它应该改为：

$('.app tbody').append( '<tr><td><span>Package '+ current_number_of_rows +'</span>: <input type="text" name="packagedims[' + current_number_of_rows + ']" value="Dimensions" title="Package '+ current_number_of_rows +'" /></td></tr>' );

Then, change the selector to this:

然后，将选择器更改为：

var packagedims = $('input[name^="packagedims"]').serialize();

Here is a demo

这是一个演示

#1