I'm using asp.net mvc i want to update data in database using a bootsrap modal And partial Views. The broblem is when i click on the link to show the Model it's not working (it shows an empty modal)
this is my Code:
//the Controller Action
public ActionResult Edit(int id = 0)
{
Tache tache = db.Taches.Find(id);
if (tache == null)
{
return HttpNotFound();
}
return PartialView("PartialEdit", tache);
}
// the index View that contain the link and the modal definition :
<td>
<a data-modal='' href='"/Tache/edit/"+@item.TacheId' data-id="@item.TacheId" id="@item.TacheId " title=" edit">Edit </a> |
@Html.ActionLink("Delete", "Delete", new { id = item.TacheId })
</td>
<div id='myModal' class='modal fade'>
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div id='myModalContent'></div>
</div>
</div>
</div>
// and this is the Partial View
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Nouvelle Tâche</h4>
</div>
@using (Html.BeginForm("Create", "Tache", FormMethod.Post, new { @id = "formId" }))
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
@Html.HiddenFor(model => model.TacheId)
<div class="modal-body">
//Some forms in inputs
<div class="row">
// Finaly my javascript :
$(function () {
$.ajaxSetup({ cache: false });
$("a[data-modal]").on("click", function (e) {
$('#myModalContent').load(this.href, function () {
$('#myModal').modal({
keyboard: true
}, 'show');
bindForm(this);
});
return false;
});
});
function bindForm(dialog) {
$('form', dialog).submit(function () {
$('#progress').show();
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
if (result.success) {
$('#myModal').modal('hide');
$('#progress').hide();
location.reload();
} else {
$('#progress').hide();
$('#myModalContent').html(result);
bindForm();
}
}
});
return false;
});
}
I think the problem may came from the link that somthing is missing their !! but i'm not sure if someone can help me that will be great Think you