0

ページを離れることなく、ネイティブ アプリからライブ サーバーを介してフォームを処理しようとしています。以下は、フォーム、JQuery、および PHP に使用しているコードですが、送信すると、ページが空白になり、文字列が URL バーに表示されます。私のコードについて助けてもらえますか。読みやすくするためにフォームを短くしました。他にもたくさんのフィールドがあります。それらをすべてJavaScriptにリストする必要がありますか?

フォーム上の HTML

<form action="http://mobile.koolantkoolers.com/mailer.php" method="get">
  <div data-role="fieldcontain">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value=""  />
</div>
<div data-role="fieldcontain">
  <label for="email">Email:</label>
  <input type="email" name="email" id="email" value=""  />
</div>

  <div data-role="fieldcontain">
    <label for="company">Company:</label>
    <textarea cols="40" rows="8" name="company" id="company"></textarea>
  </div>
<input type="button" onclick="submit()" value="submit" data-icon="star" data-theme="b" />              
  </div>
  </form>

JavaScript:

$.post('http://mobile.koolantkoolers.com/mailer.php', {

// These are the names of the form values

Name: $('name').val(),
Email: $('email').val(),
Company: $('company').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("Sorry please fill all fields!"); 
    return false;
   }
});

そしてPHP

<?php

// VARS
$Name=$_GET["name"];
$Email=$_GET["email"];
$Company=$_GET["company"];
$Headers = "From:" . $Email;

//VALIDATION
if(
$Name=="" ||
$Email=="" ||
$Company==""
) {
    echo "Error";
} else {
    mail("nnorman@dimplexthermal.com","mobile app message",$MessageText, $Headers);
    echo "Success";
}
?>
4

3 に答える 3

1

最終的に、php で次のコードと post メソッドを使用しました。div 命名規則がコードと一致していることを確認するだけです。これにより、フォームの結果が投稿され、感謝のメッセージで div が置き換えられます。以下の HTML と Javascript を参照してください。

<div data-role="content">
<form id="myform">
  <div data-role="fieldcontain">
    <label for="name">Name:</label>
    <input type="text" name="name" id="name" value=""  />
</div>
<div data-role="fieldcontain">
  <label for="email">Email:</label>
  <input type="email" name="email" id="email" value=""  />
</div>
<div data-role="fieldcontain">
  <label for="company">Company Name:</label>
  <input type="text" name="company" id="company" value=""  />
</div>        
<input type="submit" name="submit" value="Submit" data-icon="star" data-theme="b" />
</form>

</div>
<div data-role="content" style="display:none" id="formResponse">
    thank you, your quote has been received and you will hear back from us shortly.
    </div>

Javascript:

$(document).ready(function() {
            //When the form with id="myform" is submitted...
            $("#myform").submit(function() {
                //Send the serialized data to mailer.php.
                $.post("mailer.php", $("#myform").serialize(),
                    //Take our repsonse, and replace whatever is in the "formResponse"
                    //div with it.

                    function(data) {
                    $("#myform").html( $("#formResponse").html() );
                    }
                );
                return false;
            });

        });
于 2012-10-12T15:49:43.903 に答える
0

これは非常に簡単です。スクリプトでは、投稿するデータと送信先の URL を含むフォーム ID を指定します。各フォームは、PHP で何も変更せずに、指定した URL にデータを送信します。送信ボタンで呼び出される JavaScript 関数内にこれを追加します。

var form = document.getElementById('form-id');
var formData = new FormData(form);

send() 呼び出しで渡す必要があるのは、この新しい FormData インスタンスだけです。

var xhr = new XMLHttpRequest();
// Add any event handlers here...
xhr.open('POST', '/upload/path', true);
xhr.send(formData);

リンクをチェック

于 2012-10-02T21:37:02.427 に答える
0

これを行う簡単な方法は、jQuery を使用して、このような post 呼び出しを行うことです。

event.preventDefault(); 同じページにとどまることができるように、通常の方法でフォームが送信されないようにします。

$("#ID_OF_FORM").submit(関数(イベント) {

event.preventDefault();

$.post("http://mobile.koolantkoolers.com/mailer.php", $("ID_OF_FORM").serialize()); }

于 2012-10-03T07:12:21.400 に答える