Hi,
I'm tried to edit data in modal using ajax. When button edit click on table data will populate on modal but the problem is when modal showing data no populate.
Any help could be apriciate.
The COntroller.cs
[HttpGet]
public JsonResult Get_Data_Pembelian_Obat_ByID(int ID)
{
List<PembelianStockObatModel> lst = new List<PembelianStockObatModel>();
using (SqlConnection con = new SqlConnection(this._configuration.GetConnectionString("Db_Klinik")))
{
using (SqlCommand com = new SqlCommand())
{
con.Open();
com.Connection = con;
com.CommandType = CommandType.Text;
com.CommandText = "Select * From Tbl_Detail_Pembelian_Stock_Obat Where ID_Detail_Pembelian_Stock_Obat = @ID_Detail_Pembelian_Stock_Obat";
com.Parameters.AddWithValue("@ID_Detail_Pembelian_Stock_Obat", ID);
using (SqlDataReader rdr = com.ExecuteReader())
{
while (rdr.Read())
{
lst.Add(new PembelianStockObatModel
{
ID_Detail_Pembelian_Stock_Obat = rdr["ID_Detail_Pembelian_Stock_Obat"].ToString(),
Nama_Obat = rdr["Nama_Obat"].ToString(),
Jumlah = Convert.ToInt32(rdr["Jumlah"].ToString()),
Harga = Convert.ToDecimal(rdr["Harga"].ToString()),
Total_Bayar = Convert.ToDecimal(rdr["Total_Bayar"].ToString())
});
}
}
}
return Json(lst);
}
}
The Ajax for populate data on modal
<script type="text/javascript">
function getbyID(ID) {
$.ajax({
url: "/PembelianStockObat/Get_Data_Pembelian_Obat_ByID?ID=" + ID,
typr: "GET",
contentType: "application/json;charset=UTF-8",
dataType: "json",
success: function (result) {
$('#ID_Detail_Pembelian_Stock_Obat').val(result.ID_Detail_Pembelian_Stock_Obat);
$('#Nama_Obat').val(result.Nama_Obat);
$('#Harga').val(result.Harga);
$('#Jumlah').val(result.Jumlah);
$('#Total_Bayar').val(result.Total_Bayar);
$('#myModal').modal('show');
},
error: function (errormessage) {
alert(errormessage.responseText);
}
});
return false;
}
</script>
Ajax for load data on Table
<script type="text/javascript">
$(document).ready(function () {
$("#BtnShowListDataPembelianObat").on("click", function () {
$("#table1").show();
$.ajax({
url: "@Url.Action("GetAllDetailDataPembelianObat", "PembelianStockObat")",
type: "GET",
contentType: "application/json;charset=UTF-8",
dataType: "json",
data: { No_Pembelian_Obat: $('#No_Pembelian_Obat').val() },
success: function (result) {
var html = '';
var No = 1;
$.each(result, function (key, item) {
html += '<tr>';
html += '<td class="text-center">' + No++ + '</td>';
html += '<td class="text-center">' + item.ID_Detail_Pembelian_Stock_Obat + '</td>';
html += '<td class="text-center">' + item.Nama_Obat + '</td>';
html += '<td class="text-center">' + item.Jumlah + '</td>';
html += '<td class="text-center">' + item.Harga + '</td>';
html += '<td class="text-center">' + item.Total_Bayar + '</td>';
html += '<td class="text-center align-middle"><a href="#" onclick="return getbyID(' + item.ID_Detail_Pembelian_Stock_Obat + ')"><i class="fa fa-edit btn-sm btn-primary"> Edit</i></a> | <a href="#" onclick="return DeleteData(' + item.ID_Detail_Pembelian_Stock_Obat + ')" ><i class="fa fa-trash btn-sm btn-danger"> Delete</i></a></td>';
html += '</tr>';
});
$('.tbody').html(html);
},
error: function (errormessage) {
alert(errormessage.responseText);
}
});
});
});
</script>