ajax调用后使用jQuery插入记录不起作用
Posted
技术标签:
【中文标题】ajax调用后使用jQuery插入记录不起作用【英文标题】:Insert record using jQuery after ajax call doesn't work 【发布时间】:2011-09-29 19:14:18 【问题描述】:我有一个插入和加载记录(jQuery 和 php)脚本可以在不使用 AJAX 的情况下正常工作。但是在 AJAX 调用之后,插入(jQuery)不起作用。
这是我的代码:-
$(".insert").live("点击",function() var boxval = $("#content").val(); var dataString = '内容='+ boxval; 如果(boxval=='') alert("请输入一些文字"); 别的 $.ajax( 类型:“发布”, 网址:“demo.php”, 数据:数据字符串, 缓存:假, 成功:函数(html) $("table#update tbody").prepend(html); $("table#update tbody tr").slideDown("slow"); document.getElementById('content').value=''; ); 返回假; ); $(".load").live("点击",function() $.ajax( 类型:“发布”, 网址:“test.php”, 成功:功能(味精) $("#container").ajaxComplete(function(event, request, settings) $("#container").html(msg); ); ); ); );【问题讨论】:
使用 firebug 检查您的请求发生了什么。 在我使用 json 的 jQuery AJAX 脚本中,我们必须指定字段的 ID,例如 $.('#input1').val();所以 jQuery 知道它正在提交什么。这将在指定缓存属性后进入 AJAX 调用。我现在没有工作代码,但如果你以后仍然卡住,我可以发布我拥有的代码。 感谢您的回复,在萤火虫响应中是绝对建议使用您的浏览器开发工具来检查提交的确切请求,并首先查看是否存在问题。
您可能还想更改将 dataString 传递给 ajax 请求的方式。
如果你的 boxval 中有一个“&”,那么你最终会得到一个格式不正确的字符串。因此,请尝试将数据初始化为:
var data = ;
data.content = boxval;
这将要求 jQuery 为您转义值。
【讨论】:
【参考方案2】:我很想看看您的表单标记和后端 PHP 代码;它可能会提供线索。
通常我会有一个名为“action”的表单变量,只是为了告诉 PHP 代码我想要它做什么(特别是如果 PHP 脚本是一个对象上许多不同操作的控制器)。类似<input type="hidden" name="action" value="insert"/>
甚至多个<input type="submit" name="action"/>
按钮,每个按钮都有不同的值。在 PHP 代码中,我会有类似的内容:
switch ($_POST['action'])
case 'insert':
// insert record and send HTML
break;
// other actions
如果你做过这样的事情,也许 PHP 正在寻找一个不存在的变量。
由于无法查看您的代码,我强烈推荐使用非常方便的 jQuery 表单插件 http://jquery.malsup.com/form/ 。它允许您将表单转换为 AJAX 表单,正确格式化您的数据,并且不会忘记来自任何表单元素的数据(除了未单击的 <input type="submit"/>
按钮,这与非 AJAX 形式的展品)。它就像标准的$.ajax()
方法一样工作。
【讨论】:
【参考方案3】:我解决了问题
我替换了这段代码
$("#container").ajaxComplete(function(event, request, settings) $("#container").html(msg); );与
$("#container").html(msg);非常感谢您的回答
【讨论】:
【参考方案4】:<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$('.clicker').click(function()
var fname = $('.fname').val();
var lname = $('.lname').val();
var message=$('.message').val();
$.ajax(
type:"POST",
url: "submit.php",
cache:false,
data: "fname="+fname+"&lname="+lname+"&message="+message,
success: function(data)
$(".result").empty();
$(".result").html(data);
);
return(false);
);
);
</script>
</head>
<body>
<div>Data Form</div>
<form id="form1" name="form1" method="post" action="">
<input name="fname" type="text" class="fname" size="20"/><br />
<input name="lname" type="text" class="lname" size="20"/><br />
<div class="result"><textarea name="message" rows="10" cols="50" class="message"> </textarea></div>
<input type="button" value="calculate" class="clicker" />
</form>
</body>
</html>
提交.php
<?php
$con=mysql_connect("localhost","root","");
mysql_select_db("ajaxdb",$con);
$fname=$_REQUEST['fname'];
$lname=$_REQUEST['lname'];
$message=$_REQUEST['message'];
$sql="insert into person(fname,lname,message) values('$fname','$lname','$message')";
mysql_query($sql) or die(mysql_error());
echo "The data has been submitted successfully.";
?>
【讨论】:
以上是关于ajax调用后使用jQuery插入记录不起作用的主要内容,如果未能解决你的问题,请参考以下文章
完整功能中的ajax调用后刷新jquery mobile listview不起作用