0

我想做的是将表单数据传递给 php 文件,然后将结果传递回应用程序,这样用户就不会在任何时候直接访问 php 文件。

这就是我想出的,但我不能让它通过数据。我将 chrome 与 -disable-web-security 一起使用。它总是返回 false 所以我猜数据没有被传递给 php 文件。任何帮助都会很棒。还。当它转发到结果页面时,它会在几秒钟后变为空白。谢谢你。

HTML

<form id="form"   method="POST"  data-ajax="false" data-transition="pop" data-direction="reverse">
            <fieldset>


            <label for="name" class="ui-hidden-accessible">Name</label>
            <input type="text" name="name" id="name" value=""  class="required" placeholder="Name"/>


            <label for="email" class="ui-hidden-accessible">E-Mail</label>
            <input type="email" name="email" id="email" value="" class="required" placeholder="E-Mail"/>


            <label for="memory" class="ui-hidden-accessible">Memory</label>
            <textarea name="memory" name="memory" id="memory"  class="required" placeholder="Your Memory..."></textarea>



            <label for="submit" class="ui-hidden-accessible">Submit</label>
            <input type="submit" name="submit" id="submit" value="SEND">

             </fieldset>
        </form>

JS

$(document).on('pagebeforeshow', '#formPage', function(){

$(document).on('click', '#submit', function() { // catch the form's submit event

    if($('#name').val().length > 0 && $('#email').val().length > 0 && $('#memory').val().length > 0){


        var that = $(this),
            contents = that.serialize();


        // Send data to server through ajax call
        // action is functionality we want to call and outputJSON is our data


        $.ajax({
            url: 'http://www....',
            dataType: 'json',
            type: 'post',
            data: contents,
            async: true,
            beforeSend: function() {
                // This callback function will trigger before data is sent
                $.mobile.showPageLoadingMsg(true); // This will show ajax spinner
            },
            complete: function() {
                // This callback function will trigger on data sent/received complete
                $.mobile.hidePageLoadingMsg(); // This will hide ajax spinner
            },

            success: function(data) {
                console.log(data);


            },
            error: function (request,error) {
                // This callback function will trigger on unsuccessful action
                alert('Network error has occurred please try again!');
            }
        });


    } else {
        alert('Please fill all nececery fields');
    }
    return false; // cancel original event to prevent form submitting
});
});

PHP

header('Content-type: text/javascript');

$json = array(
'success'       => false,
'result'        => 0


);

if(isset($_POST['name'], $_POST['email'], $_POST['memory'])){

$name       = $_POST['name'];
$email      = $_POST['email'];
$memory     = $_POST['memory'];

$json['success'] = true;
$json['result']  = $name;

}

echo json_encode($json);
4

1 回答 1

1

您没有正确序列化表单数据,结果是内容变量为空。

更改此代码:

  var that = $(this),
  contents = that.serialize();

对此:

 //var that = $(this),  // <-- delete this line
 contents = $('#form').serialize();

您还需要修复..

您还没有意识到这一点,但是您通过将点击处理程序放在 bagebeforeshow 事件中创建了多次点击绑定问题。为了防止这种情况发生,您需要

更改此代码:

 $(document).on('pagebeforeshow', '#formPage', function(){

对此:

 $(document).on('pageinit', '#formPage', function(){

这样$(document).on('click', '#submit', function() {,无论用户离开并返回“#formPage”页面多少次,您都只会绑定一次

已编辑

不,通过 ajax 提交给后端 PHP 程序的数据不是 json 编码的。它是标准的 HTTP POST 数据,可通过 $_POST(或 $_REQUEST)访问。

我的服务器上有您的代码(以及我在上面的答案中概述的更改)。我已将我设置的两个文件用于测试您的代码,以供您参考:

php文件:

(为您的环境编辑包含的 javascript 文件的路径)

sandbox_ajax_form.php

javascript文件:

(编辑表单数据发送到的路径)

sandbox_ajax_form.js

于 2013-08-14T21:30:48.750 回答