以下是一個ajax的post例子。代碼為script部分
jQuery之ajax post篇------Code
<script type="text/javascript">
function adddata()
{
var typeName=$("#<%=this.typeName.ClientID%>").val();
var msg=" not be empty";
if(typeName=="")
{
if(msg!="")
{
alert(msg);
return false;
}
}
else
{
//顯示進度條
$("#loading").ajaxStart(function(){
$(this).show();
});
//提交前觸發的事件
$("#msg").ajaxSend(function(request, settings){$(this).append("<li>Starting request at " + settings.url + "</li>");});
//這裡的countryid 可以動態從GridView裡面取
var countryid= $("#<%=this.drpCountry.ClientID%>").val();//擷取下拉式功能表值
var countryname=format_get_name(countryid);//擷取下拉式功能表文本
var typeName = $("#<%=this.typeName.ClientID%>").val();//擷取txt為typeName的值
var showTypeDesc = $("#<%=this.showTypeDesc.ClientID%>").val();//擷取txt為showTypeDesc的值
//調用Juqery Ajax
$.ajax({
type: "POST",
url: "addNews.aspx",
timeout: 20000,
error: function(){alert('error');},
data: "countryid="+countryid+"&countryname="+countryname+"&typeName="+typeName+"&showTypeDesc="+showTypeDesc,
success: function(msg)
{
var text=msg.split('<');
//當AJAX請求失敗時添加一個被執行的方法
$("#msg").ajaxError(function(request, settings){
$(this).append("<li>Error requesting page " + settings.url + "</li>");
});
//當AJAX請求成功時添加一個被執行的方法
$("#msg").ajaxSuccess(function(request, settings){
$(this).append(text[0]);
});
//清空文本裡面的值
$("#<%=this.typeName.ClientID%>").val("");
$("#<%=this.showTypeDesc.ClientID%>").val("");
return false;
}
});
}
}
//擷取下拉式功能表裡面的常值內容
function format_get_name(id)
{
var drp = $('<%=drpCountry.ClientID%>');
for ( var i =0;i<drp.options.length;i++)
{
if ( drp.options[i].value == id )
{
return drp.options[i].text;
}
}
return '';
}
</script>