フォームと送信ボタンがあります。通常、送信アクションが実行されると、新しいページに戻り、部分ビューは更新されません。jqueryライブ関数でajax呼び出しを使用していますが、提供されたモデルで部分ビューを返すのではなく、コンテンツ全体を置き換えます。以下は、_detailfile.cshtml 内の私のコードです。アプリケーションはファイルをアップロードしますが、コンテンツ全体を置き換えます。
<div id="trainingFileDiv" style="overflow: auto; height: 470px;">
<table class="fileTable">
@foreach (var training in Model.TrainingList)
{
using (Html.BeginForm("fileForm", "Home/TempUpload", new { employeeId = Model.Id, trainId= @training.Id }, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
if (training.TrainingFile != null)
{
<tr>
<td>
</td>
</tr>
}
else
{
<tr>
<td class="view_detail_label" style="width: 250px;">
@training.Name.Name
</td>
<td>
<input type="file" name="@training.Id"/>
</td>
</tr>
<tr><td><input type="submit" name="Submit" id="Submit" value="Yükle" /></td>
</tr>
}
}
}
</table>
</div>
以下は、div ファイルのみを更新するスクリプトですが、機能しません。
$("fileForm").live("submit", function (event) {
if (form.valid()) {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
$('#trainingFileDiv').html(result);
}
});
}
event.preventDefault();
});
これはネットで見つけた別のコードで、div ではなくすべてのコンテンツを更新します。
$(function () {
$('fileForm').submit(function () {
if ($(this).valid()) {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
$('#trainingFileDiv').html(result);
}
});
}
return false;
});
});
ここで何が欠けていますか？ご協力ありがとうございました
EDIT1
controller から部分ビューが返されると、Uncaught ReferenceError: $ is not definedfileForm:7を取得します
すべてのフォームを ajaxify する EDIT2 関数。edit1でエラーが発生します
$(function () {
$('form').submit(function () {
if ($(this).valid()) {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
$('#trainingFileDiv').append(result);
},
});//end of ajax call
}//end of if
}); });
EDIT3以下のコードではエラーはありませんが、Request にファイルがありません。関数のすぐ下にコントローラー コードが表示されます。しかし、true または false を返すと、ファイルは Request オブジェクトに配置され、コントローラーに送信されます。しかし、返品時にすべてのコンテンツが置き換えられます。ここで何が問題なのですか？
$('form').submit(function (event) {
if ($(this).valid()) {
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
$('#trainingFileDiv').html(result);
},
complete: function () {
console.log("Complete");
},
error: function () {
console.log("Error");
}
}); //end of ajax call
} //end of if
//return true;//if commented no error on jquery side but no files are passed to controlller
});
foreach (string upload in Request.Files)
{
string path = AppDomain.CurrentDomain.BaseDirectory + "uploads/";
string filename = Path.GetFileName(Request.Files[upload].FileName);
TrainingFile file = new TrainingFile();
file.Name = filename;
file.Path = path;
var training = _work.TrainingRepository.GetSet().Where(a => a.EmployeeId == employeeId && a.Id == trainId).ToList().ElementAt(0);
training.TrainingFile = file;
training.FileId = file.Id;
_work.TrainingFileRepository.Add(file);
_work.TrainingFileRepository.Save();
_work.TrainingRepository.UpdateAndSave(training);
_work.TrainingRepository.Save();
Request.Files[upload].SaveAs(Path.Combine(path, filename));
}