weixin_33727510 2016-06-09 11:43 采纳率: 0%
浏览 9

AJAX未提交FOM

I am working with a script wherein I should be able to submit a form without page reload with the help of AJAX. The problem is that the form is not submitted to the database. Any help would be appreciated. I had messed with the codes but nothing works for me.

Here is the javascript code:

<script type="text/javascript">
    setInterval(function() {
        $('#frame').load('chatitems.php');
    }, 1);
    $(function() {
        $(".submit_button").click(function() {
            var textcontent = $("#content").val();
            var usercontent = $("#username").val();
            var namecontent = $("#nickname").val();
            var dataString = 'content=' + textcontent;
            var userString = 'content=' + usercontent;
            var nameString = 'content=' + namecontent;

            if (textcontent == '') {
                alert("Enter some text..");
                $("#content").focus();
            } else {
                $("#flash").show();
                $("#flash").fadeIn(400).html('<span class="load">Loading..</span>');
                $.ajax({
                    type: "POST",
                    url: "chatitems.php",
                    data: {
                        dataString,
                        userString,
                        nameString
                    },
                    cache: true,
                    success: function(html) {
                        $("#show").after(html);
                        document.getElementById('content').value = '';
                        $("#flash").hide();
                        $("#frame").focus();
                    }
                });
            }
            return false;
        });
    });
</script>

this is my form:

<form action="" method="post" name="form">
    <input type="hidden" class="form-control" id="username" name="username" value="<?php echo $username; ?>" readOnly />
    <input type="hidden" class="form-control" id="nickname" name="nickname" value="<?php echo $nickname; ?>" readOnly />
    <input type="hidden" class="form-control" id="chat_role" name="chat_role" value="<?php echo $pm_chat; ?>" readOnly />
    <input type="hidden" class="form-control" id="team" name="team" value="<?php echo $manager; ?>'s Team" readOnly />
    <input type="hidden" class="form-control" id="avatar" name="avatar" value="<?php echo $avatar; ?>" readOnly />
    <div class="input-group">
        <input type="text" class="form-control" id="content" name="content" />
        <span class="input-group-btn">
            <input type="submit" name="submit" class="submit_button btn btn-primary" value="Post"></input> 
        </span>
    </div>
</form>

and finally, this is my PHP code:

<?php
include('db.php');
$check = mysql_query("SELECT * FROM chat order by date desc");
if(isset($_POST['content']))
{
    $content=mysql_real_escape_string($_POST['content']);
    $nickname=mysql_real_escape_string($_POST['nickname']);
    $username=mysql_real_escape_string($_POST['username']);
    $ip=mysql_real_escape_string($_SERVER['REMOTE_ADDR']);
    mysql_query("insert into chat(message,ip,username,nickname) values ('$content','$ip','$username','$nickname')");
}

$req = mysql_query('select * from chat ORDER BY date desc');
while($dnn = mysql_fetch_array($req))
{
    ?>
    <div class="showbox">
    <p><?php echo $dnn['username']; ?> (<?php echo $dnn['ip']; ?>): <?php echo $dnn['message']; ?></p>
    </div>
    <?php
}
?>

I know there is something wrong with my code somewhere but had spent few days already but no avail. Im hoping that someone would help.

UPDATE The form is being submitted successfully with this code only data: dataString but when I added the nameString and the userString thats when everything doesnt work as it should. I tried messing around that code but still got nothing.

  • 写回答

2条回答 默认 最新

  • weixin_33696106 2016-06-09 11:57
    关注

    To find out what is wrong with this you need to establish that:

    a) The click event is firing, which you could test by adding a console.log('something'); at the top of that function.

    b) The AJAX function is working somewhat correctly, which again you could check by adding a console.log() in the success callback of the AJAX request. You can also check console for errors, e.g if the chatitems.php is 404'ing

    c) That all the data you're collecting from the DOM e.g var textcontent = $("#content").val(); contains what you're expecting it to. Again console.log().

    d) That the page you're calling is successfully processing the data you're sending across, so die() a print_r() of the $_POST values to check the data it's receiving is in the format your expecting. You also need to add some error handling to your mysql code: https://secure.php.net/manual/en/function.mysql-error.php (or better yet use PDO or MySQLi https://secure.php.net/manual/en/book.pdo.php), which will tell you if there's something wrong with your MySQL code. You can check the return of you're AJAX call (which would include any errors) by console.log(html) in your success callback.

    Information you gather from the above will lead you to your bug.

    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题