JQuery/Ajax 返回 Success 消息并显示 Saved 指示器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25087527/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery/Ajax return Success message and display Saved indicator
提问by R B
This is my first try with JQuery/Ajax. I have a RadDatePicker, where on selection of a date, the date is saved in the DB and the user should get a message that date is saved. The RadDatePicker calls a function on its event OnDateSelected as follows(C#):
这是我第一次尝试使用 JQuery/Ajax。我有一个 RadDatePicker，在选择日期时，日期保存在数据库中，用户应该收到一条消息，说明日期已保存。RadDatePicker 在其事件 OnDateSelected 上调用一个函数，如下所示（C#）：
radDatePicker.ClientEvents.OnDateSelected = "function(sender, args){SaveDate(sender,args," + PriceDealProposalId + ")}";
The javascript function SaveDate successfully calls a webservice to save the date selected.
javascript 函数 SaveDate 成功调用网络服务来保存所选日期。
function SaveDate(sender, e, id) {
if (e.get_newDate() != null) {
$.ajax({
url: "/ajaxservice.asmx/SaveSignedDate",
data: "{priceDealProposalId:" + id + ",proposalDate: " + JSON.stringify(e.get_newDate()) + "}",
dataType: "json",
type: "POST",
contentType: "application/json;charset=utf-8",
success: function (data) {
alert("saved");
}
});
}
}
The above successfully saves the value and alerts a message. Instead of an alert I want to display a text message near this RadDatePicker control which says "Saved" and disappears in a few seconds. I am not sure how to interpret this success message and display a text. Please help me.
以上成功保存值并提示消息。我想在此 RadDatePicker 控件附近显示一条文本消息，而不是警报，该消息显示“已保存”并在几秒钟内消失。我不确定如何解释此成功消息并显示文本。请帮我。
回答by Adeel Gill
Try this code,
试试这个代码，
Create a div with id='msg'.
And use this success function.
创建一个 div id='msg'。并使用此成功功能。
success: function(data) {
$('#msg').html(data).fadeIn('slow');
//$('#msg').html("data insert successfully").fadeIn('slow') //also show a success message
$('#msg').delay(5000).fadeOut('slow');
}
回答by nmos
You just need to set the Display:none attribute to the element you want to show on Success Callback
您只需要将 Display:none 属性设置为要在 Success Callback 上显示的元素
HTML
HTML
<p id="myElem" style="display:none">Saved</p>
Success Callback
成功回调
success: function (data) {
$("#myElem").show();
setTimeout(function() { $("#myElem").hide(); }, 5000);
}
