jQuery模态表单提交

Question

I am attempting to submit a modal jQuery form. I took the code pretty much from the site with just a few tweaks and moved the javascript to its own file.

I am struggling with getting the form information to pass to my php script which I am attempting through AJAX. When I pull the serializedArray() of the form I get [object Object]for each element in the form. I've simplified the php to just the email field until I can get this working. Am I misunderstanding the logic behind this?

HTML

<div id="dialog-form">
        <form id="sign_up_form" name="sign_up_form" method="post">
            <fieldset>
              <label for="name">Name*</label>
              <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
              <label for="email">Email*</label>
              <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
              <label for="password">Password*</label>
              <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
              <label for="code">Code</label>
              <input type="code" name="code" id="code" value="" class="text ui-widget-content ui-corner-all" />
            </fieldset>
        </form>
    </div>

JQuery - bValid is the form validation and works as expected

$(  "#dialog-form"  ).dialog({
    autoOpen: false,
    height: 300,
    width: 350,
    modal: true,
    buttons: {
        "Create an account": function() {

        var data_string = $( "#sign_up_form" ).serializeArray();

        alert(data_string);

        if ( bValid ) {
            $.ajax({
                type: "POST",
                url: url,
                dataType: "json",
                data: data_string,
                success: function(data){
                    alert(data)
                }
            });
            $( this ).dialog( "close" );
        }
      },
      Cancel: function() {
        $( this ).dialog( "close" );
      }
    },
    close: function() {
      allFields.val( "" ).removeClass( "ui-state-error" );
    }
});

PHP

if (isset($_POST['email'])) {
    $jsonReceiveData = $_POST['email']; 
}
else{
    $jsonReceiveData = "didn't pass";
}
echo json_encode($jsonReceiveData);

Answer 1

Use var data_string = $( "#sign_up_form" ).serialize(); instead of var data_string = $( "#sign_up_form" ).serializeArray(); . serializeArray() returns an array not a query string

.serialize()