使用php从表单中使用JQuery Mobile进行基本POST

Firstly I apologize for posting another one of these questions, but I've dove through a ton of SO questions related to this topic and haven't be able to figure out my problem. I'm new to PHP and an amature at best using Jquery mobile and the like.

I'm attempting to post to a .php file and get a response back. Eventually this will evolve into a database posting yada yada. For now, I can't seem to get my response back from my post. I'm running Xampp to host the php, Jquery Mobile is being used in other functions so it does work properly,

HTML:

<form>
        <p>Username: </p><input type="text" id="username" value="" />
        <p>Password: </p><input type="text" id="password" value="" />
        <input type="button" onclick="submitLogIn()" value="Log In" />
</form>

Javascript:

function submitLogIn() {

    alert("Submitting: " + $('#username').val() + $('#password').val());
    var dbURL = "http://localhost/testerpage.php";

    $.post(dbURL, {
        //These are the names of the form values
        Username: $('#username').val(),
        Password: $('#password').val()

    }, function (data,status) {
        alert(status); //Won't fire
        alert(html); //Won't fire
        var response = html;
        alert(response); //Won't fire
        if (response == "Success")
        {
            alert("Success!"); //Won't fire
            //testlog.innerHTML = "Success";
        }
        else
        {
            alert("Failure!");//Won't fire
            //testlog.innerHTML = "Failure";
        }

    });

    alert("Finished"); //Fires

};

PHP

<?php

    // VARS
    $Username=$_GET["Username"]; //Also tried _POST
    $Password=$_GET["Password"]; //Also tried _POST

    //VALIDATION
    if(
    $Username=="" ||
    $Password==""
    ) {
        echo "Error";
    } else {
        echo "Success";
    }
?>

My best guess is that something is wrong with the .php because all of the questions I've looked at seem to confirm my JavaScript is right. All of my alerts fire except the ones in the call back function. The username and password are also correctly being set so that isn't the problem. I tried using _POST and _GET in my .php, I originally was using _POST because I was posting data but I was following this question: (Phonegap contact form not working over PHP) and it did the opposite so I changed it. No difference. My .php is actually hosted for sure (I can navigate to it without an error). I also tried using the $.ajax function but had the same issues.

Thanks in advance.

EDIT: Added more of the HTML (all that should be relevant) per request, can't add it all as it is too long.

    <html>
        <head>
            <meta charset="utf-8" />
            <meta name="format-detection" content="telephone=no" />
            <meta name="msapplication-tap-highlight" content="no" />
            <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
            <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" />

            <!-- Stylesheets -->
            <link rel="stylesheet" href="css/snctfy2/snctfy2.css" />
            <link rel="stylesheet" href="css/snctfy2/jquery.mobile.icons.min.css" />

            <link rel="stylesheet" type="text/css" href="css/index.css" />
            <link href="jquerymobile/jquery.mobile.structure-1.4.2.min.css" rel="stylesheet" type="text/css" /> <!-- Add .structure after theme-->

            <!-- Jquery core -->
            <script src="js/jquery.js" type="text/javascript"></script>

            <!-- Jquery mobile library file -->
            <script src="jquerymobile/jquery.mobile-1.4.2.min.js" type="text/javascript"></script>

            <!-- DateBox -->
            <link rel="stylesheet" type="text/css" href="css/jqm-datebox.css" />
            <script type="text/javascript" src="js/datebox/jqm-datebox.core.js"></script>
            <script type="text/javascript" src="js/datebox/jqm-datebox.mode.calbox.js"></script>
            <script type="text/javascript" src="js/datebox/jqm-datebox.mode.datebox.js"></script>
            <script type="text/javascript" src="js/datebox/jquery.mobile.datebox.i18n.en_US.utf8.js"></script>


            <!-- Scripts (pre-load)-->
            <script src="js/scripts.js" type="text/javascript"></script>

            <!-- CSS Override -->
            <link rel="stylesheet" type="text/css" href="css/override.css" />

            <title>SNCTFY</title>
        </head>
        <body>

    <!--there is some more <div> tags here unrelated-->
        <!--------------------------------------------------------Login Page---------------------

-------------------------------------------->
            <div data-role="page" id="login" data-theme="a" class="bPage">
                <div data-role="content">
                    <form>
                        <p>Username: </p><input type="text" id="username" value="" />
                        <p>Password: </p><input type="text" id="password" value="" />
                        <input type="button" onclick="submitLogIn()" value="Log In" />
                    </form>
                    <a href="#register" data-role="button">Register</a>
                    <button onclick="showAlert()">Test</button>
                    <p id="testlog">Results</p>
                </div>
            </div>

    <!-- more <div> pages -->

            <!-- Scripts (post-load)-->
            <script type="text/javascript" src="phonegap.js"></script>
            <script type="text/javascript" src="cordova.js"></script>
            <script type="text/javascript" src="js/index.js"></script>
            <script type="text/javascript">
                app.initialize();
            </script>
        </body>
    </html>

EDIT2: Changed JavaScript to one of the answers to test

function submitLogIn() {
    alert("Submitting: " + $('#username').val() + $('#password').val());
    var username = $('#username').val();
    var password = $('#password').val();
    $.ajax({
        type: "POST",
        url: "http://localhost/testerpage.php", 
        data: { "Username": username, "Password": password },
        success: function (data) {
            if (data) {

                alert(data);
            }
            else {
                alert('Successfully not posted.');
            }
        }
    });

};
douci2516
douci2516 为什么你不使用jqueryajax?
5 年多之前 回复

3个回答



只需尝试jquery Ajax </ p>

 &lt; body&gt; 
&lt; form&gt; \ n&lt; p&gt;用户名:&lt; / p&gt;&lt; input type =“text”id =“username”value =“”/&gt;
&lt; p&gt;密码:&lt; / p&gt;&lt; input type = “text”id =“password”value =“”/&gt;
&lt; input type =“button”onclick =“submitLogIn()”value =“登录”/&gt;
&lt; / form&gt;
&lt; 脚本&gt;
function submitLogIn(){
alert(“正在提交:”+ $('#username')。val()+ $('#password')。val());
var username = $('#username ').val();
var password = $('#password')。val();
$ .ajax({
type:“POST”,
url:“http:// localhost / testerpage .php“,
data:{”Username“:username,”Password“:password},
success:function(data){
if(data){

alert(data);
}

其他{
alert('未成功发布。');
}
}
});

}

&lt; / script&gt;
&lt; / body&gt;
&lt; / PHP中的html&gt;
</ code> </ pre>

</ p>

 &lt;?php 
$ Username = $ _ POST [“Username” ]。 //也尝试了_POST
$ Password = $ _ POST [“密码”]; //也尝试了_POST

// VALIDATION
if(
$ Username ==“”||
$ Password ==“”
){
echo“错误”;
}其他{\ n echo“Success”;
}
?&gt;
</ code> </ pre>
</ div>

展开原文

原文

Just try jquery Ajax

<body>
<form>
    <p>Username: </p><input type="text" id="username" value="" />
    <p>Password: </p><input type="text" id="password" value="" />
    <input type="button" onclick="submitLogIn()" value="Log In" />
</form>
<script>
function submitLogIn() {
alert("Submitting: " + $('#username').val() + $('#password').val());
var username =$('#username').val();
var password =  $('#password').val();
$.ajax({
    type: "POST",
    url: "http://localhost/testerpage.php",
    data:{"Username":username,"Password":password},
    success: function(data) {
    if (data) {

       alert(data);
    }
    else {
        alert('Successfully not posted.');
    }
    }
    });

    }

</script>
</body>
</html>

in PHP

<?php
$Username=$_POST["Username"]; //Also tried _POST
$Password=$_POST["Password"]; //Also tried _POST

//VALIDATION
if(
$Username=="" ||
$Password==""
) {
    echo "Error";
} else {
    echo "Success";
}
?>

doushantun0614
doushantun0614 upvote如果有什么东西帮助你我们的对话:)
5 年多之前 回复
douche3791
douche3791 很高兴知道代码有效。 必须是html文件中带有<script>标记顺序的内容。 就像我说的,我在同一个.js文件中使用$ .get罚款。 我尝试在html文件中添加该函数,但它也无法正常工作。 我明天会再讨论一下,看看能否找到根本原因。
5 年多之前 回复
douzhang6176
douzhang6176 becoz我使用你的代码,它完美地为我工作,我将javascript代码添加到html文件并添加jquery <script src =“ajax.googleapis.com/ajax/libs/jquery/1.11.1 / ...>
5 年多之前 回复
douzhi4830
douzhi4830 嘿,您可以在同一个html文件中添加完整的jquery代码吗?
5 年多之前 回复
dongxu2398
dongxu2398 嘿,用我的代码更新你的javascript代码?
5 年多之前 回复
dongxun1244
dongxun1244 这是整个PHP代码(我需要更多?)我正在用更全面的HTML编辑问题,虽然我当前的html文件是~700行(使用本地导航的phonegap应用程序)所以我只是添加相关的部分。
5 年多之前 回复
douben6670
douben6670 你能告诉我你的完整HTML和PHP代码吗?
5 年多之前 回复
dongtan6336
dongtan6336 是的,它包含在其他功能中。 我不确定我得到了什么错误。 我通过firebug运行它并且它遍历了.ajax中的所有内容(在你的版本中)但是当它到达成功函数时它就像是跳过了它。 我没有在任何地方抛出错误。
5 年多之前 回复
dongmei8071
dongmei8071 你得到的错误?
5 年多之前 回复
doremifasodo0008008
doremifasodo0008008 Draze你包括jquery吗?
5 年多之前 回复
dousi9215
dousi9215 没有工作,甚至尝试在html文档中的<script>标签内进行,就像你做的那样(之前是外部的),我没有得到任何东西。
5 年多之前 回复
doufan1899
doufan1899 尝试这个让我知道。是否正在工作?
5 年多之前 回复



试试这个:</ p>

  function submitLogIn(){

alert( “正在提交:”+ $('#username')。val()+ $('#password')。val());
var dbURL =“http://localhost/testerpage.php”;
\ n //这些是表单值的名称
var username = $('#username')。val();
var password = $('#password')。val();

$ .ajax({
url:dbURL,
type:'post',
data:'&amp; username ='+ username +'&amp; pass ='+ password,
success:function(response){
警报(响应);
}
});

};

&lt;?php

// VARS
$ Username = $ _ POST [“username” ]。 //也尝试了_POST
$ Password = $ _ POST [“pass”]; //也尝试_POST

// VALIDATION
if(
$ Username ==“”||
$ Password ==“”
){
echo“Error”;
} else {

echo“成功”;
}
?&gt;
</ code> </ pre>
</ div>

展开原文

原文

Try this:

function submitLogIn() {

    alert("Submitting: " + $('#username').val() + $('#password').val());
    var dbURL = "http://localhost/testerpage.php";

    //These are the names of the form values
    var username = $('#username').val();
    var password = $('#password').val();

    $.ajax({
         url: dbURL,
         type:'post',
         data:'&username='+username+'&pass='+password,
         success:function(response){
              alert(response);
         }
     });

};




<?php

    // VARS
    $Username=$_POST["username"]; //Also tried _POST
    $Password=$_POST["pass"]; //Also tried _POST

    //VALIDATION
    if(
    $Username=="" ||
    $Password==""
    ) {
        echo "Error";
    } else {
        echo "Success";
    }
?>

dongzuan4917
dongzuan4917 这并没有解决我的问题。
5 年多之前 回复



尝试此代码
script </ p>

 &lt; script&gt; 
function submitLogIn() {
alert(“正在提交:”+ $('#username')。val()+ $('#password')。val());
var dbURL =“http://localhost/testerpage.php “;

$ .post(dbURL,{
//这些是表单值的名称
用户名:$('#username')。val(),
密码:$('#password ').val()

},函数(数据,状态){
if(data ==“Success”)
{
alert(“Success!”); //不会触发\ n //testlog.innerHTML =“成功”;
}
其他
{
alert(“失败!”); //不会触发
//testlog.innerHTML =“失败”;
}

});

警报( “完成”); // Fires
};
&lt; / script&gt;
</ code> </ pre>

PHP </ p>

  // VARS 
$用户名= $ _ POST [ “用户名”]; //也尝试了_POST
$ Password = $ _ POST [“密码”]; //也尝试了_POST

// VALIDATION
if(
$ Username ==“”||
$ Password ==“”
){
echo“错误”;
}其他{\ n echo“Success”;
}
</ code> </ pre>
</ div>

展开原文

原文

try this code script

<script>
function submitLogIn() {
  alert("Submitting: " + $('#username').val() + $('#password').val());
  var dbURL = "http://localhost/testerpage.php";

  $.post(dbURL, {
    //These are the names of the form values
    Username: $('#username').val(),
    Password: $('#password').val()

}, function (data,status) {
    if (data == "Success")
    {
        alert("Success!"); //Won't fire
        //testlog.innerHTML = "Success";
    }
    else
    {
        alert("Failure!");//Won't fire
        //testlog.innerHTML = "Failure";
    }

});   
alert("Finished"); //Fires
};
</script>

PHP

// VARS
$Username=$_POST["Username"]; //Also tried _POST
$Password=$_POST["Password"]; //Also tried _POST

//VALIDATION
if(
$Username=="" ||
$Password==""
) {
    echo "Error";
} else {
    echo "Success";
}

doujiu3095
doujiu3095 对不起,我花了这么长时间回复。 我实际上试图做一个更简单的帖子,它也不起作用。 如果我执行.ajax响应,我会抛出错误函数,但唯一抛出的是“错误”状态。 错误消息为null。 我认为访问我的localhost php脚本有问题,我不知道权限或需要更改的内容,但这是我唯一能想到的错误。
5 年多之前 回复
doukun8670
doukun8670 Draze,我更改了回调以及php代码中的$ _post。 请检查你的dburl是否有效。 您在开发者控制台中有任何错误吗? 你知道如何调试你的JavaScript代码吗?
5 年多之前 回复
dthtvk3666
dthtvk3666 这并没有解决问题,因为唯一改变的是回调函数,目前还没有被调用。
5 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐