duanmu6231
duanmu6231
2015-01-22 18:09
浏览 65

带有jquery移动联系表单的Phonegap应用程序无效

I was building hybrid app using jQuery mobile and Phonegap, but I am stuck with the contact form here. The code is located here:

http://jsfiddle.net/8cpdcfow/

At the jsfiddle the only difference is that send.php is given as send.php without url because it is located in the root folder. I was using code earlier like a webapp and it worked very well but I don't know why now it displays Message sent message but the message is not sent. Here is the code hosted: http://radio-pendimi.com/mobile/v2/#dergomesazh

UPDATE 2:

Now online on the web the contact form works very well,but after I builded webapp for android using phonegap and installed on android device when I press the submit button to send the message it returns me the whole php code of the form instead of Message sent or Message failed message. Below is screenshot:

http://i60.tinypic.com/abqya0.jpg

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width,
        height=device-height, target-densitydpi=device-dpi" />
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
<title>Radio Pendimi - online streaming</title>
<link rel="apple-touch-icon" href="images/AppIcon.png" />
    <!-- CSS LIDHJET -->
<link rel="stylesheet" href="css/new_template.min.css" />
<link rel="stylesheet" href="css/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="css/jquery.mobile.structure-1.4.0-rc.1.min.css" />
<link rel="stylesheet" href="css/stili.css"/>
    <!-- JS LIDHJET  -->
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.mobile-1.4.0-rc.1.min.js"></script>
<script src="js/myscript.js"></script>
<script type="text/javascript" src="phonegap.js"></script>
</head>
<body>

 <!-- Kanali 1 - homepage -->
<div data-role="page" id="home" data-theme="b" style="background:#242426" >
<!-- Header -->
<div data-role="header" data-id="ap_header" style="background-color:#fafafc;border-top:6px solid #2f4c73">
<a href="index.html" data-icon="home" data-iconpos="notext"></a><h1 style="color:#444;text-shadow: none;font-family: Dosis;"> Radio Pendimi 24h Live </h1>
<a href="#dergomesazh" data-role="button" data-inline="true" data-mini="true" data-icon="mail" data-iconpos="notext"></a>
</div>
<!-- content -->
<div data-role="none">
    <img src="images/pendimi-logo-white.png" style="width: 210px; margin-right:auto; margin-left:auto;display: block;padding-top: 30px;"/>
<p style="text-align:center;text-shadow:none; color:#fff; margin:0px; padding-top:16px; padding-left: 5px; padding-right: 5px;">Jeni duke ndëgjuar: <script type="text/javascript" src="http://www.digital-webstream.de/status.php?mode=title&id=3204"></script> <br><br>
<audio src="http://server2.digital-webstream.de:35505/;$type=mp3" id="player" autoplay></audio>
<div style="text-align:center">
    <span onclick="document.getElementById('player').play()" class="btn_control"> PLAY</span>
    <span onclick="document.getElementById('player').pause()" class="btn_control"> STOP</span>
    <span onclick="document.getElementById('player').muted=!document.getElementById('player').muted" class="btn_control"> MUTE/UNMUTE</span>
    </div>
</div>
<!-- footer -->
<div data-role="footer" data-position="fixed" data-id="ap_footer">
<!-- footer navbar -->
    <div data-role="navbar" style="border-bottom:6px solid #2f4c73">
        <ul>
            <li><a href="#home" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 1</a></li>
            <li><a href="#kanali-2" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 2</a></li>
            <li><a href="#donacion" data-icon="shop" data-iconpos="top" data-transition="none">Donacion</a></li>
            <li><a href="#info" data-icon="info" data-iconpos="top" data-transition="none">Info</a></li>
        </ul>
    </div>
</div>
</div>
<!-- End Page -->

<!-- Informacione -->
<div data-role="page" id="info" data-theme="b" style="background:#242426" >
<!-- Header -->
<div data-role="header" data-id="ap_header" style="background-color:#fafafc;border-top:6px solid #2f4c73">
<a href="index.html" data-icon="home" data-iconpos="notext"></a><h1 style="color:#444;text-shadow: none;font-family: Dosis;"> Info </h1>
</div>
<!-- content -->
<div data-role="none">
 <img src="images/pendimi-logo-white.png" style="width: 210px; margin-right:auto; margin-left:auto;display: block;padding-top: 30px;">
    <p align="center">
      <a href="mailto:info@radio-pendimi.com" style="text-decoration:none; text-shadow:none; color: #fff;font-weight: 500;font-size: 20px; font-family: Dosis;">info@radio-pendimi.com </a><br>
      <a href="http://radio-pendimi.com" style="text-decoration: none; text-shadow:none; color: #fff; font-weight: 500; font-size: 20px; font-family: Dosis;">http://radio-pendimi.com </a><br>
        <span style="text-decoration: none; text-shadow:none; color: #fff; font-weight: 500; font-size: 15px; font-family: Dosis;">Programuar & Dizajnuar nga Afrim Azizi</span> <br>
      <a href="https://www.facebook.com/radioopendimi" target="_blank"><img src="images/find-us-on-facebook.png" style="width: 170px; padding: 5px;"/></a>
  </p> 
  </div>
<!-- footer -->
<div data-role="footer" data-position="fixed" data-id="ap_footer">
<!-- footer navbar -->
    <div data-role="navbar" style="border-bottom:6px solid #2f4c73">
        <ul>
            <li><a href="#home" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 1</a></li>
            <li><a href="#kanali-2" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 2</a></li>
            <li><a href="#donacion" data-icon="shop" data-iconpos="top" data-transition="none">Donacion</a></li>
            <li><a href="#info" data-icon="info" data-iconpos="top" data-transition="none">Info</a></li>
        </ul>
    </div>
</div>
</div>
<!-- End Page -->


<!-- Kanali 2 -->
<div data-role="page" id="kanali-2" data-theme="b" style="background:#242426" >
<!-- Header -->
<div data-role="header" data-id="ap_header" style="background-color:#fafafc;border-top:6px solid #2f4c73">
<a href="index.html" data-icon="home" data-iconpos="notext"></a><h1 style="color:#444;text-shadow: none;font-family: Dosis;"> Kanali - 2 </h1>
</div>
<!-- content -->
<div data-role="none">
     <img src="images/pendimi-logo-white.png" style="width: 210px; margin-right:auto; margin-left:auto;display: block;padding-top: 30px;"/>
<p style="text-align:center;text-shadow:none; color:#fff; margin:0px; padding-top:16px; padding-left: 5px;padding-right: 5px;">Jeni duke ndëgjuar: <script type="text/javascript" src="http://www.digital-webstream.de/status.php?mode=title&id=7399"></script> <br><br>
<audio src="http://server6.digital-webstream.de:8400/;$type=mp3" id="player-2"></audio>
<div style="text-align:center">
    <span onclick="document.getElementById('player-2').play()" class="btn_control"> PLAY</span>
    <span onclick="document.getElementById('player-2').pause()" class="btn_control"> STOP</span>
    <span onclick="document.getElementById('player-2').muted=!document.getElementById('player-2').muted" class="btn_control"> MUTE/UNMUTE</span>
    </div>
</div>
<!-- footer -->
<div data-role="footer" data-position="fixed" data-id="ap_footer">
<!-- footer navbar -->
    <div data-role="navbar" style="border-bottom:6px solid #2f4c73">
        <ul>
            <li><a href="#home" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 1</a></li>
            <li><a href="#kanali-2" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 2</a></li>
            <li><a href="#donacion" data-icon="shop" data-iconpos="top" data-transition="none">Donacion</a></li>
            <li><a href="#info" data-icon="info" data-iconpos="top" data-transition="none">Info</a></li>
        </ul>
    </div>
</div>
</div>
<!-- End Page -->


<!-- Donacione - Kontribo edhe ti -->
<div data-role="page" id="donacion" data-theme="b" style="background:#242426" >
<!-- Header -->
<div data-role="header" data-id="ap_header" style="background-color:#fafafc;border-top:6px solid #2f4c73">
<a href="index.html" data-icon="home" data-iconpos="notext"></a><h1 style="color:#444;text-shadow: none;font-family: Dosis;"> Info </h1>
</div>
<!-- content -->
<div data-role="none">
 <p style="text-align:center; text-shadow:none; color:#fff;"> 
Vëllezër dhe motra,
Kjo Radio çdo ditë bëhet shkak për udhëzimin e dikujt dhe kthimin e tij në rrugën e xhenetit, mirëpo ajo nuk mund ta çojë mesazhin e saj në vend pa përkrahje financiare. Nëse ju jepni kontributin tuaj do të keni hise në sevapet që fitohen nga kjo punë. Pejgamberi, alejhi salatu ue selam, ka thënë: “Sadakaja e shuan zemërimin e Allahut ashtu sikur uji e shuan zjarrin” (Sahihu Tergib nr. 983).
Ju bëjmë thirrje që ta përkrahni këtë projekt madhështor, për mirësinë e të cilit jemi dëshmitarë të gjithë ne.
Keto jan pikat kryesore :<br>
–          Mirëmbajtjen dhe rritjen e kapacitetit të serverëve.<br>
–          Mirëmbajtjen materiale të studiove që kemi në disa vende, sidomos studion numër 2 – Prizren, e cila ka një orar më të zgjeruar dhe më të pasur,<br>
–          Mirëmbajtjen e ueb-faqes dhe serverit të veçantë që ka ajo,<br>
–          Marketingun e Radio Pendimit në përgjithësi (fllajera, pllakata, reklama nëpër medie, etj.).<br>
Allahu ju shpërbleftë!
<p style="text-align:center; text-shadow:none; color:#fff;">Mund të kontribuoni nëpërmjet llogarisë bankare:<br>
Emri: Radio Pendimi<br>
Emri i bankës: Volksbank Linz <br>
IBAN: AT744480042614830000<br>
Bic Swift Code: VBWEAT2WXXX
    </p>
    <br>
    <!-- PayPal Form start -->
    <div style="text-align:center"> 
    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top"><input name="cmd" type="hidden" value="_s-xclick"> <input name="hosted_button_id" type="hidden" value="GRGWN8J9JDM6U"> <input alt="Jetzt einfach, schnell und sicher online bezahlen – mit PayPal." name="submit" src="https://www.paypalobjects.com/de_DE/AT/i/btn/btn_donateCC_LG.gif" type="image"> <img src="https://www.paypalobjects.com/de_DE/i/scr/pixel.gif" alt="" width="1" height="1" border="0"></form>
    </div> <!-- PayPal form end -->
    </p>
  </div>
<!-- footer -->
<div data-role="footer" data-position="fixed" data-id="ap_footer">
<!-- footer navbar -->
    <div data-role="navbar" style="border-bottom:6px solid #2f4c73">
        <ul>
            <li><a href="#home" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 1</a></li>
            <li><a href="#kanali-2" data-icon="audio" data-iconpos="top" data-transition="none">Kanali 2</a></li>
            <li><a href="#donacion" data-icon="shop" data-iconpos="top" data-transition="none">Donacion</a></li>
            <li><a href="#info" data-icon="info" data-iconpos="top" data-transition="none">Info</a></li>
        </ul>
    </div>
</div>
</div>
<!-- End Page -->

<!-- Dergo Mesazh -->
<div data-role="page" id="dergomesazh" data-theme="b">
<!-- Header -->
<div data-role="header" data-position="fixed" style="background-color:#fafafc;border-top:6px solid #2f4c73">
        <h1 style="color:#444;text-shadow:none">Dërgo Mesazh</h1>
    <a href="#home"  data-role="button" data-inline="true" data-mini="true" data-icon="home" data-iconpos="notext" data-transition="none"></a>
</div>

<!-- content -->
<div data-role="content">
    <form class="form" id="callAjaxForm">
    <p class="name">
        <input name="emri" type="text" class="validate[required,custom[onlyLetter],length[0,100]] feedback-input" placeholder="Emri" id="name" data-role="none"  />
      </p>

      <p class="text">
        <textarea name="comment" class="validate[required,length[6,30]] feedback-input" id="comment" placeholder="Mesazhi" data-role="none" ></textarea>
      </p>


      <div class="submit">
        <button id="submit" type="submit" >DËRGO</button>
        <button id="reset" type="reset" >PASTRO FUSHAT</button>
      </div>
       <h3 id="notification" align="center" style="font-color:green;"></h3>
    </form>
</div>
<!-- footer -->

</div>
<!-- End Page -->

</body>
</html>

myscript.js

//DergoMesazh
function onSuccess(data, status)
        {
            data = $.trim(data);
            $("#notification").text(data);
        }

        function onError(data, status)
        {
            // handle an error
        }        

        $(document).ready(function() {
            $("#submit").click(function(){

                var formData = $("#callAjaxForm").serialize();

                $.ajax({
                    type: "POST",
                    url: "send.php",
                    cache: false,
                    data: formData,
                    success: onSuccess,
                    error: onError
                });
                return false;
            });
            $("#reset").click(function() {
                $('#callAjaxForm').trigger("reset");
                $('#notification').text("");
            });
        });

Send.php code:

<?php
header('Access-Control-Allow-Origin: *');

$emri=$_POST['emri'];
$mesazhi=$_POST['comment'];
$IPAdresa = $_SERVER["REMOTE_ADDR"];


$browser="";
     if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("MSIE"))){$browser="ie";}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("Presto"))){$browser="opera";}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("CHROME"))){$browser="chrome";}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("SAFARI"))){$browser="safari";}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("FIREFOX"))){$browser="firefox";}
else {$browser="other";}

$to = "afrim.a@msn.com";
$subject = "Rubrika DergoMesazh (mobile app)";
$message = " Emri: " . $emri . "
 Mesazhi: " . $mesazhi. "
 IP Adresa: " . $IPAdresa. "
 Browser: " . $browser;


$from = "radio-v2@test.com";
$headers = "From:" . $from . "
";
$headers .= "Content-type: text/plain; charset=UTF-8" . "
"; 

if(@mail($to,$subject,$message,$headers))
{
  echo "Mesazhi juaj u dërgua me sukses";
}else{
  echo "Gabim! Ju lutemi provoni përsëri.";
}
?>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • doumigu9594
    doumigu9594 2015-01-22 23:10
    已采纳

    Ok now I fixed the problem and I wanted to share the solution for others who have this issue. The myscript.js from where is made ajax call to the PHP file (send.php),instead of declaring local php file you need to declare the url of the php file because while building the app with phonegap/cordova it doesn't execute the php file. Also you need to enable crossDomain:true, Below is the fully functional code in jsfiddle: http://jsfiddle.net/8cpdcfow/1/

    Here is the send.php code:

    <?php
    header('Access-Control-Allow-Origin: *');
    
    $emri=$_POST['emri'];
    $mesazhi=$_POST['comment'];
    $IPAdresa = $_SERVER["REMOTE_ADDR"];
    
    
    $browser="";
         if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("MSIE"))){$browser="ie";}
    else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("Presto"))){$browser="opera";}
    else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("CHROME"))){$browser="chrome";}
    else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("SAFARI"))){$browser="safari";}
    else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("FIREFOX"))){$browser="firefox";}
    else {$browser="other";}
    
    $to = "your-email@hotmail.com";
    $subject = "Rubrika DergoMesazh (mobile app)";
    $message = " Name: " . $emri . "
     Message: " . $mesazhi. "
     IP Adresa: " . $IPAdresa. "
     Browser: " . $browser;
    
     //Maybe you need to add $from email into whitelist at your inbox because the messages may be classified to the junk/spam folder
    
    $from = "no-reply@domain.com";
    $headers = "From:" . $from . "
    ";
    $headers .= "Content-type: text/plain; charset=UTF-8" . "
    "; 
    
    if ($emri == "" || $mesazhi == ""){
    echo "Empty strings,the form is not filled";
    } else {
    if(@mail($to,$subject,$message,$headers))
    {
      echo "Message Sent successfully";
    }else{
      echo "Message Failed to sent.Try again";
    }
    }
    ?>
    
    点赞 评论
  • douliedai4838
    douliedai4838 2015-01-22 18:20

    Try using the above code in Phonegap using input type=button instead of input type=submit.

    Also, double check if the required assets for Phonegap [Cordova.js,jquery and other JS] are loaded properly.

    Also it would help, if you can post the entire code as it is bundled in Phonegap

    点赞 评论

相关推荐