在不使用 jQuery/Ajax/PHP 回发的对话框中提交表单



好的,所以我正在尝试提交地址信息而不刷新页面(或回发)。我不断得到"意想不到的输入结束",我不确定我在这里做错了什么。这对我来说都是新的,如果有菜鸟错误,很抱歉!

更新

更新的 PHP,见下文。仍然通过以下更改出现意外的输入结束错误。

j查询代码:

        $( "#ChangeAddressDialog" ).dialog({
            width:500,
            modal:true,
            closeOnEscape:true,
            buttons: [ 
                { text: "Ok", type: "submit", click: function() { 
                        $.ajax({
                            url: "classes/add-address.php",
                            timeout: 30000,
                            type: "POST",
                            data: $("#main_form").serialize(),
                            dataType: 'json',
                            error: function(SMLHttpRequest, textStatus, errorThrown){
                                alert("An error has occurred making the request. " + errorThrown);
                            },
                            success: function(data){
                                //do stuff here on success such as modal info
                                //$("#main_form").submit();
                                alert('Address change information has been successfully submitted.');
                                $(this).dialog("close");
                            }
                        });
                    }
                },
                { text: "Close", click: function() { $(this).dialog( "close" ); } } ]
        });
    });

PHP代码:更新

<?php
require_once('../config.php');
$sqlCheck = ''; 
$parcel_id = isset($_POST['ParcelId']) ? $_POST['ParcelId'] : null;
$address1 = isset($_POST['Address1']) ? $_POST['Address1'] : null;
$address2 = isset($_POST['Address2']) ? $_POST['Address2'] : null;
$city = isset($_POST['City']) ? $_POST['City'] : null;
$state = isset($_POST['State']) ? $_POST['State'] : null;
$zip = isset($_POST['Zip']) ? $_POST['Zip'] : null;
$country = isset($_POST['Country']) ? $_POST['Country'] : null;
$db = new ezSQL_mysql(DB_USER, DB_PASSWORD, DB_NAME, DB_HOST);
$result = $db->query("INSERT INTO change_of_address (parcel_id, address_1, address_2, City, State, Zip, Country) VALUES ('" . $parcel_id . "','" . $address1 . "','" . $address2 . "','" . $city . "','" . $state . "','" . $zip . "','" . $country . "')");
if ($result == 1) {
    echo true;
} else {
    echo false;
}

?>

编辑:对于S.Pols

<script>
    $(document).ready(function() {
        $('#column-chooser').hide();
        $('#CommentsDialog').hide();
        $('#ChangeAddressDialog').hide();
        $('#HelpDialog').hide();
        $('#ExportDialog').hide();
        $("#SearchButton").click(function() { window.location.href = '/?s=' + $("#search").val(); });   
        $('#searchTable tr').click(function(){
            var parcel_id = $(this).attr('id');
            $('#ParcelId').val(parcel_id);
            $.ajax({
                url: "classes/get-apn.php?id=" + parcel_id,
                type: "GET",
                data: { parcel_id : parcel_id },
                dataType: 'json',
                error: function(SMLHttpRequest, textStatus, errorThrown){
                    alert("An error has occurred making the request: " + errorThrown);
                },
                success: function(data){
                    //do stuff here on success
                    $('#ParcelNumber').html(data[0]["apn"]);
                    //$('#ViewComments').html('Veiw ' + count + ' Comments');
                }
            });
        });
    });//end document ready function
    /*$('#dataTable').DataTable({
        "searching": false,
        "lengthChange": false,
        "scrollY": "300px",
        "scrollCollapse": true,
        "paging": false,
        "info": false
    });*/
    $( "#AddComment" )
        .button()
        .click(function( event ) {
        e.preventDefault();
    });
    $('#ShowColumnChooser').click(function() {
        //show/hide div
        $('#column-chooser').slideToggle('slow');
    });
    $('#Help').click(function() {
        //help dialog box
        $( "#HelpDialog" ).dialog({
            width: 500,
            modal:true,
            closeOnEscape:true,
            buttons: [ { text: "Close", click: function() { $(this).dialog( "close" ); } } ]
        });
    });
    $('#Export').click(function() {
        //export options dialog
        $( "#ExportDialog" ).dialog({
            width: 500,
            modal:true,
            closeOnEscape:true,
            buttons: [ { text: "Close", click: function() { $(this).dialog( "close" ); } } ]
        });
    });
    $('#ViewComments').click(function() {
        //view/add comments dialog
        $( "#CommentsDialog" ).dialog({
            height:300,
            width: 500,
            modal:true,
            closeOnEscape:true,
            buttons: [ { text: "Close", click: function() { $(this).dialog( "close" ); } } ]
        });
        $("#InsertComment").focus();
    });//end view comments click function
    $('#ChangeOfAddress').click(function() {
        //change of address dialog
        $('#change_of_address_form').val('1');
        $( "#ChangeAddressDialog" ).dialog({
            width:500,
            modal:true,
            closeOnEscape:true,
            buttons: [ 
                { text: "Ok", type: "submit", click: function() { 
                        $.ajax({
                            url: "classes/add-address.php",
                            type: "POST",
                            data: $("#main_form").serialize(),
                            dataType: 'json',
                            error: function(SMLHttpRequest, textStatus, errorThrown){
                                alert("An error has occurred making the request: " + errorThrown)
                            },
                            success: function(result){
                                //do stuff here on success such as modal info
                                $("#main_form").submit();
                                $(this).dialog("close");
                            }
                        })
                    } 
                },
                { text: "Close", click: function() { $(this).dialog( "close" ); } } ]
        });
    });
    $(function() {
        $('#datepicker1,#datepicker2,#datepicker3,#datepicker4').datepicker({
            showOn: 'both',
            buttonImage: 'images/calendar.png',
            buttonImageOnly: true,
            buttonText: 'Select Date'
        });
    });
</script>

您没有回显 php 脚本中的内容。

$result = $db->query( ... );

我不熟悉ezSQL_mysql但它应该返回一个对象或数组,然后你应该回显它,如下所示:

if ($result){
    echo 'true'; // or 1, or '{"success': 'ok'}
}else{
    echo 'false'; // or 0, or '"success': 'error'}
}

header('Content-Type: application/json');
echo json_encode($result);  // if $result is an associative array

尝试从浏览器调用 php 脚本,并使用更适合您需求的响应。鉴于您将在javascript中使用响应,json响应是您可以使用的最佳响应。一定要告诉 php 使用 json 输出响应,而不是文本header('Content-Type: application/json');

在 js 端你可以使用 console.log在两个函数中查看服务器返回的内容

success: function(data){
    console.log(data);
    // do your stuff here
}

最新更新