我有一个简单的表格
HTML
<form action="@Url.Action("Controler", "FES")" method="POST">
<button name="upload" type="submit" id="upload-fes-btn-control" class="btn btn-danger">Contrôler</button>
</form>
提交时的请求时间有时可能会很长(超过30秒,大文件上的业务逻辑包...)
我想在用户单击按钮后更改按钮的值。目的是显示超棒的字体加载器,而不是初始文本(<i class="fas fa-spinner fa-pulse"></i>
)。我使用了jQuery片段来实现这一目标...
jQuery
$("#upload-fes-btn-control").click(function () {
$(this).attr('value', '<i class="fas fa-spinner fa-pulse"></i>');
});
由于我的控制器中存在此代码,我遇到了错误
从客户端检测到潜在的Request.Form值
控制器
if (Request.Form["upload"] != null)
{
//Logic with ViewModel...
}
如何在不引发该错误的情况下将按钮中显示的文本从文本更改为fa图像加载器?
答案 0 :(得分:1)
使用此代码$(this).html('<i class="fa fa-spinner fa-pulse"></i>');
$("#upload-fes-btn-control").click(function (e) {
e.preventDefault();
$(this).html('<i class="fa fa-spinner fa-pulse"></i>');
//example after page load
setTimeout(function(){
$("#upload-fes-btn-control").html('');
$("#upload-fes-btn-control").html('Contrôler');
}, 5000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<form action="@Url.Action("Controler", "FES")" method="POST">
<button name="upload" type="submit" id="upload-fes-btn-control" class="btn btn-danger">Contrôler</button>
</form>