我有这个:
查看:
<div id="tabs-2">
@using (Ajax.BeginForm("EditPhotos", "Account",
new AjaxOptions()
{
InsertionMode = InsertionMode.Replace,
HttpMethod = "Post",
},
new { enctype = "multipart/form-data"}
))
//new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Photos</h4>
<hr />
@Html.ValidationSummary(true)
@Html.HiddenFor(model => model.Id)
<form class="form-horizontal">
<div class="editor-label">
@Html.LabelFor(model => model.DisplayItem)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.DisplayItem)
</div>
<div id="upload-choices">
<div class="editor-label">
@Html.LabelFor(m => m.Image)
@Html.ValidationMessageFor(model => model.Image)
</div>
<div class="editor-row">
@Html.ValidationSummary(true)
</div>
</div>
<br />
<img width="200" height="150" src="@Url.Action("GetImage", "Account", new { id = Model.Id })">
<input type="file" name="file" />
</form>
<br />
<div class="pull-left">
<div class="col-md-offset-0">
<input type="submit" value="Save" class="btn btn-default pull-left" />
</div>
</div>
</div>
}
<br /><br />
<div>
@Html.ActionLink("Back to List", "Index")
</div>
</div>
和jquery:
@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.11.0.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.10.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script>
$(document).ready(function () {
$("#tabs").tabs();
$("#tabs").tabs("select", window.location.hash);
//var param = $(document).getUrlParam('selectedTab');
//$('#tabs').tabs('select', param);
});
</script>
}
和控制器操作方法:
[HttpPost]
public ActionResult EditPhotos(UserProfile userprofile,HttpPostedFileBase file)
{
if (file != null && file.ContentLength > 0)
{
// extract only the fielname
var fileName = Path.GetFileName(file.FileName);
// store the file inside ~/App_Data/uploads folder
var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
file.SaveAs(path);
}
if (ModelState.IsValid)
{
string username = User.Identity.Name;
// Get the userprofile
UserProfile user = db.userProfiles.FirstOrDefault(u => u.UserName.Equals(username));
// Update fields
user.Image = new byte[file.ContentLength];
file.InputStream.Read(user.Image, 0, file.ContentLength);
user.ImageMimeType = file.ContentType;
db.Entry(user).State = EntityState.Modified;
db.SaveChanges();
return Redirect(Url.Action("Edit", "Account") + "#tabs-2");
}
return View(userprofile);
}
oke,我可以保存照片,当我保存照片时,当前标签会保留所选标签。但保存后屏幕上升。所以这似乎是一个完整的帖子,而不是部分回发。在我保存之前我看到了三个标签。但是在我保存标签后弹出。但我做了一个ajax电话。那怎么可能呢?
谢谢
哦,我现在就这样:@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.11.0.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.10.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script>
$(document).ready(function () {
$("#tabs").tabs();
$(document).on("click", ".btn", function () {
$("#tabs").tabs("select", window.location.hash);
//var param = $(document).getUrlParam('selectedTab');
//$('#tabs').tabs('select', param);
});
});
</script>
}
因为如果我喜欢这样:
$(document).on("click", ".btn", function () {
$("#tabs").tabs();
$("#tabs").tabs("select", window.location.hash);
//var param = $(document).getUrlParam('selectedTab');
//$('#tabs').tabs('select', param);
});
我再也看不到标签了
我有这个:
<div class="pull-left">
<div class="col-md-offset-0">
<input type="button" value="Save" class="btn btn-default pull-left" />
</div>
</div>
</div>
但你是什么意思,你没有看到Ajax电话?
我有这个:
<div id="tabs-2">
@using (Ajax.BeginForm("EditPhotos", "Account",
new AjaxOptions()
{
InsertionMode = InsertionMode.Replace,
HttpMethod = "Post",
},
new { enctype = "multipart/form-data"}
))
//new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Photos</h4>
<hr />
等...
但保存后,屏幕仍会亮起
好吧,我现在就这样: $(document).ready(function () {
$.ajax({
url: resolveUrl("/Account/EditPhotos/"),
type: "POST",
processData: false,
contentType: false,
data: data,
success: function (response) {
//code after success
},
error: function (er) {
alert(er);
}
});
});
但页面仍在上升
如果我这样做:
$(document).on("click", ".btn", function(){
$("#ajaxUploadForm").ajaxForm({
iframe: true,
type: 'POST',
dataType: "json",
cache: false,
timeout: 1200000,
async: false,
beforeSubmit: function () {
//Do something here if needed like show in progress message
},
//success: function (result) {
// alert("sucess"
// },
error: function (xhr, textStatus, errorThrown) {
alert("Error uploading file");
}
});
});
使用:
<div class="pull-left">
<div class="col-md-offset-0">
<input type="button" value="Save" class="btn btn-default pull-left" />
</div>
</div>
然后没有任何反应,
答案 0 :(得分:0)
我没有看到你发布的ajax代码,但你的按钮是一个提交按钮,而不仅仅是一个按钮。你需要将其改为
<input type="button" value="Save" class="btn btn-default pull-left" />
并在您的脚本中将事件更改为单击事件
$(document).on("click", ".btn", function(){
...