Javascript 链接在身体上具有ajax调用的方法
我有这门课:Javascript 链接在身体上具有ajax调用的方法,javascript,jquery,jquery-datatables,jquery-callback,Javascript,Jquery,Jquery Datatables,Jquery Callback,我有这门课: function Clazz() { this.id; this.description; } Clazz.prototype._insert = function(_description, _success, _error) { this.description = _description; $.ajax({ type : "PUT", url : "api/route", data : JSON.stringify(this), dat
function Clazz() {
this.id;
this.description;
}
Clazz.prototype._insert = function(_description, _success, _error) {
this.description = _description;
$.ajax({
type : "PUT",
url : "api/route",
data : JSON.stringify(this),
dataType : "json",
contentType : "application/json;charset=UTF-8",
success : function() {
_success($("#message"), 'OK');
},
error : function() {
_error($("#message"), 'FAIL');
}
});
};
Clazz.prototype._findAll = function(_callback) {
$.ajax({
type : "GET",
url : "api/route",
dataType : "json",
success : function(data) {
_callback(data);
}
});
};
在单击按钮时,我有以下信息:
var clazz = new Clazz();
clazz._insert($("#description").val(), success, error);
clazz._findAll(loadCallback);
在loadCallback方法下面:
function loadCallback(data){
var oTable = $('#table').dataTable({
"bRetrieve": true,
"bDestroy" : true,
"bFilter" : false,
"bLengthChange" : false,
"bInfo" : false,
"sDom" : "<'row'<'span5'l><'span5'f>r>t<'row'<'span5'i><'span5'p>>",
"sPaginationType" : "bootstrap",
"oLanguage" : {
"sProcessing" : "Loading ...",
"sZeroRecords" : "No records",
"oPaginate" : {
"sNext" : "",
"sPrevious" : ""
}
},
"iDisplayLength" : 4,
"aaData" : data,
"aoColumnDefs" : [
{ "aTargets" : [0], "mData" : "description", "sTitle" : "My Data" },
{ "aTargets" : [1],
"sWidth" : "20px",
"mData" : "id",
"bSortable" : false,
"mRender" : function ( data ) {
return '<a href="#" name="route-' + data + '" route="' + data + '"><img src="img/img01.png" style="height: 20px; width: 20px;"/></a>';
}
},
{ "aTargets" : [2],
"sWidth" : "20px",
"mData" : "id",
"bSortable" : false,
"mRender" : function ( data ) {
return '<a href="#" name="route-' + data + '" route="' + data + '"><img src="img/img02.png" style="height: 20px; width: 20px;"/></a>';
}
},
{ "aTargets" : [3],
"sWidth" : "20px",
"mData" : "id",
"bSortable" : false,
"mRender" : function ( data ) {
return '<a href="#" name="route-' + data + '" route="' + data + '"><img src="img/img03.png" style="height: 20px; width: 20px;"/></a>';
}
}
],
"fnHeaderCallback" : function( nHead ) {
$(nHead.getElementsByTagName('th')[0]).attr("colspan","4");
for(var i = 1; i <= 3; i++){
$(nHead.getElementsByTagName('th')[1]).remove();
}
},
"fnRowCallback" : function( nRow ) {
$(nRow.getElementsByTagName('td')[1]).attr("width","20px");
$(nRow.getElementsByTagName('td')[2]).attr("width","20px");
$(nRow.getElementsByTagName('td')[3]).attr("width","20px");
}
});
oTable.fnClearTable();
oTable.fnAddData(data);
oTable.fnDraw();
}
函数加载回调(数据){
var oTable=$(“#表”).dataTable({
“bRetrieve”:没错,
是的,
“bFilter”:错误,
“bLengthChange”:false,
“bInfo”:假,
“sDom”:“t”,
“sPaginationType”:“引导程序”,
“语言”:{
“数据处理”:“加载…”,
“sZeroRecords”:“无记录”,
“oPaginate”:{
“sNext”:“,
“以前的”:”
}
},
“iDisplayLength”:4,
“aaData”:数据,
“aoColumnDefs”:[
{“aTargets”:[0],“mData”:“description”,“sTitle”:“My Data”},
{“目标”:[1],
“sWidth”:“20px”,
“mData”:“id”,
“可移植”:错误,
“mRender”:功能(数据){
返回“”;
}
},
{“目标”:[2],
“sWidth”:“20px”,
“mData”:“id”,
“可移植”:错误,
“mRender”:功能(数据){
返回“”;
}
},
{“目标”:[3],
“sWidth”:“20px”,
“mData”:“id”,
“可移植”:错误,
“mRender”:功能(数据){
返回“”;
}
}
],
“fnHeaderCallback”:功能(nHead){
$(nHead.getElementsByTagName('th')[0]).attr(“colspan”,“4”);
for(var i=1;i$。如果clazz,when
应该起作用。_insert
返回$。ajax
函数调用(当前没有)
如果返回$.ajax
调用,您应该能够执行以下操作:
$.when(clazz.\u insert(…stuff…)。然后(clazz.\u findAll(…stuff…);
仔细检查延迟对象上的属性可能是个好主意。我解决了以下问题:
将return$.ajax(…stuff…
放入insert方法
使用
$.when(clazz._insert($("#description").val())).done(
function(){
clazz._findAll(loadCallback);
}
);
我必须在一个匿名函数中调用\u findAll
。我尝试过,但没有成功,可能是因为ajax类型被放置了吗?