在phonegap中使用php表单

Question

我之前曾请求过帮助，以使我的php表单在phonegap ipa中工作。我完全按照我的吩咐做了，一切都很好，即使在 ipa 内部也是如此。我唯一的问题是我在页面加载时收到此警报，显然当客户忘记填写必填字段时，它应该显示出来。

这是我所做的：

联系表格.html

 <form action="http://mobile.alicante-intermedia.com/submit_contact.php" method="get">
          <div class="form-element">
        <label for="txtfullname">Firstname</label>
        <input id="txtfullname" name="FirstName" type="text" placeholder="required" required />
      </div>
      <div class="form-element">
        <label for="txtemail">Lastname</label>
        <input id="txtemail" name="LastName" type="text" placeholder="required" required  />
      </div>
      <div class="form-element">
        <label for="txtcontact">Email</label>
        <input id="txtcontact" name="Email" type="email" placeholder="optional" />
      </div>
      <div class="form-element">
        <label for="txtmessage">Message</label>
        <textarea id="txtmessage" name="MessageText" placeholder="required" rows="5" required ></textarea>
      </div>
      <input type="button" onclick="submit()" value="submit contact"/>
      </form>

然后我创建了一个仅在连接内部加载的jquery_form.js文件.html

$.post('http://mobile.alicante-intermedia.com/submit_contact.php', {
    // These are the names of the form values
    FirstName: $('#FirstName_input').val(),
    LastName: $('#LastName_input').val(),
    Email: $('#Email_input').val(),
    MessageText: $('#MessageText_input').val()
    // HTML function
    }, function (html) {
        // Place the HTML in a astring
        var response=html;
        // PHP was done and email sent
        if (response=="success") {
            alert("Message sent!"); 
        } else {
            // Error postback
            alert("Please fill all fields!"); 
        return false;
    }
});

php看起来像这样：

<?php
    // VARS
    $FirstName=$_GET["FirstName"];
    $LastName=$_GET["LastName"];
    $Email=$_GET["Email"];
    $MessageText=$_GET["MessageText"];
    $Headers = "From:" . $Email;
    //VALIDATION
    if(
    $FirstName=="" ||
    $LastName=="" ||
    $Email=="" ||
    $MessageText==""
    ) {
        echo "Error";
    } else {
        mail("[e-mail]","mobile app message",$MessageText, $Headers);
        echo "Success";
    }
?>

除了警报屏幕外，一切正常。这里有谁知道出了什么问题？

Answer 1

你的 JavaScript 代码是"裸的"，没有包装在任何函数中或附加到任何事件处理程序，因此在加载后立即执行 - 因此当第一次解析 jQuery 脚本时它会立即发布一个空表单。

将其放入提交按钮的onclick事件处理程序中：

// When the document has loaded...
$(document).ready(function() {
  // Bind this action as a function to be executed when the button is clicked...
  $('input[type="button"][value="submit contact"]').click(function() {
    $.post('http://mobile.alicante-intermedia.com/submit_contact.php', {
      // These are the names of the form values
      // EDIT: You have the wrong ids on these...
      FirstName: $('#txtfullname').val(),
      LastName: $('#txtemail').val(),
      Email: $('#txtcontact').val(),
      MessageText: $('#txtmessage').val()
      // HTML function
      }, function (html) {
          // Place the HTML in a astring
          var response=html;
          // PHP was done and email sent
          if (response=="success") {
            alert("Message sent!"); 
          } else {
            // Error postback
            alert("Please fill all fields!"); 
            return false;
          }
    });
  });
});

由于它绑定在 JavaScript 代码中，因此请从标记中的按钮中删除onclick：

<input type="button" value="submit contact"/>

编辑：

你拥有的PHP正在$_GET中寻找值，但你已经从jQuery发布了它们。而是看$_POST.

$FirstName=$_POST["FirstName"];
$LastName=$_POST["LastName"];
$Email=$_POST["Email"];
$MessageText=$_POST["MessageText"];