调整为移动设备时，DataTables无法将AJAX表单提交给PHP

Question

I am having an issue when submitting form data using AJAX on resized screen to mobile. 在调整大小的屏幕上使用AJAX向移动设备提交表单数据时遇到问题。 All works fine when you resize the page to desktop. 当您将页面调整为桌面大小时，一切正常。

I am using jQuery DataTables and I have a button on each row to edit the form. 我正在使用jQuery DataTables，每行都有一个按钮来编辑表单。 All works fine when the page is not resized and the DataTable is in full screen, As soon as I resize the page to mobile and tablets, the DataTable creates an green "plus" icon on the left to expand the table but when I click on the edit button, I am getting an error Invalid Ajax Request and in the console Uncaught SyntaxError: Unexpected token < 当页面未调整大小且DataTable处于全屏模式时，一切正常，将页面调整为手机和平板电脑大小后，DataTable在左侧创建一个绿色的“加号”图标以展开表格，但是当我单击编辑按钮，我收到一个错误Invalid Ajax Request并在控制台中出现Uncaught SyntaxError: Unexpected token <

Again this works on large screen sizes but not on mobile and tablets. 同样，这适用于大屏幕尺寸，但不适用于手机和平板电脑。

I am using PHP MVC, here is the code: 我正在使用PHP MVC，下面是代码：

My jQuery function: 我的jQuery函数：

$(function () {
    $("form#editEmailTemplate").on('submit', function (e) {
        var postData = $(this).serialize();
        var formURL = $(this).attr("action");
        var formMethod = $(this).attr("method");
        $.ajax({
            url: formURL,
            type: formMethod,
            data: postData,
            mimeType: "multipart/form-data",
            scriptCharset: "UTF-8",
            ContentType: 'html',
            dataType: 'html',
            success: function (data, textStatus, jqXHR) {
                var returnedData = JSON.parse(data);
                for (var i = 0; i < returnedData.length; i++) {
                    $('#response').empty();
                    $("#DataTableEmails_wrapper").hide();
                    $("#updateEmailTemplate").show();

                    $('#emailid').val(returnedData[0][i].emailid);
                    $('.emailtitle').text(returnedData[0][i].title);
                    $('#emailsubject').val(returnedData[0][i].subject);
                    $('#emailtext').val(returnedData[0][i].textmessage);
                    $('#emailhtml').val(returnedData[0][i].htmlmessage);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                $('#response').html('<div class="alert alert-danger">Something went wrong !!! . Email tremplate has NOT  been  selected</div>');
                setTimeout(fade_out, 10000);
                function fade_out() {
                    $("#response").fadeOut().empty();
                }
            }
        });
        e.preventDefault(); //STOP default action
    });
});

And the HTML form is: HTML形式为：

<form class="ui segment error" role="form" method="post" accept-charset="UTF-8" 
    action="mail/editEmailTemplate/" id="editEmailTemplate">
    <input type="hidden" name="emailid" value="' . $value['emailid'] . '">
    <input type="image" name="submit" value="" src = "' . ICO . 'system/configure.png" 
        width="20" height="auto" title = "' . lang('BTN_EDIT_EMAIL_TEMPLATE_TOOLTIP') . '"/>
</form>

The form has same structure and data on all screen sizes so hasn't change on resize. 该表格在所有屏幕尺寸上都具有相同的结构和数据，因此在调整大小时不会改变。

Answer 1

It's possible that your formURL is returning with an HTML formatted 404 not found. 您的formURL返回的可能是未找到HTML格式的404。 When it does this it will contain 当它这样做时，它将包含

<html></html>

which isn't valid javascript or if that file is PHP and there's an error in it it's also responding with an HTML format leading with '<' in the response. 无效的javascript或该文件为PHP，并且其中存在错误，它还会以HTML格式响应，并在响应中以“ <”开头。 Since this isn't a valid response it will break when encountered. 由于这不是有效的响应，因此在遇到时会中断。

调整为移动设备时，DataTables无法将AJAX表单提交给PHP

问题描述

1 个解决方案

解决方案1
0 2015-08-30 02:22:19

调整为移动设备时，DataTables无法将AJAX表单提交给PHP

问题描述

1 个解决方案

解决方案1 0 2015-08-30 02:22:19

解决方案1
0 2015-08-30 02:22:19