Bu makalemizde sizinle ASP.NET MVC üzerinden iç içe dropdownlist kullanımını göstereceğiz. Konu üzerinde internette birçok makale okudum ama net olarak anlatan bir yazı bulamadım. Nasıl olduğunu çözdükten sonra sizinle de paylaşmak istedim.
veri tabanımız aşağıdaki gibi.
ilişkilendirme yaptığımız tablolar bu ikisi. bize lazım olan kolonların altı çizili.
zaten entitiy framework ile veri tabanını uygulamamızla ilişkilendirdiğimiz için o kodların içeriğini atma gereği duymuyorum. Merak eden yada yapamayanlar yorum olarak yazsın. paylaşırım kendileriyle.
projemin içeriğinden sizinle kodları paylaşacağım o yüzden sayfa isimlerine pek takılmamak gerek.
cshtml kodları
java script kodları
</pre>
</style>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script>
$(function () {
$.ajax({
type: "GET",
url: "/user/getcountries",
datatype: "Json",
success: function (data) {
$.each(data, function (index, value) {
$('#dropdownCountry').append('<option value="' + value.Value + '">' + value.Text + '</option>');
});
}
});
$('#dropdownCountry').change(function () {
$('#dropdownState').empty();
$.ajax({
type: "POST",
url: "/user/GetStatesByCountryId",
datatype: "Json",
data: { countryId: $('#dropdownCountry').val() },
success: function (data) {
$('#dropdownState').append('<option value=0>Hizmet Seçiniz</option>')
$.each(data, function (index, value) {
$('#dropdownState').append('<option value="' + value.Value + '">' + value.Text + '</option>');
});
}
});
});
html içeriği
<div class="input-group ">
<b>Kategori</b><br />
@Html.DropDownList("dropdownCountry", new SelectList(string.Empty, "Value", "Text"), "Kategori Seçiniz...", new { @class = "form-control col-md-12", style = "width: 100%;" })
</div>
<div class="input-group"> <b>Hizmetlerimiz</b><br />
@Html.DropDownList("dropdownState", new SelectList(string.Empty, "Value", "Text"), "Hizmet Seçiniz...", new { @class = "form-control", style = "width: 100%;" })
</div>
CONTROLLER KODLARI
public IList<kategoriler> kat()
{
return db.kategorilers.ToList();
}
public IList<urunler> urun(int ID)
{
return db.urunlers.Where(x=>x.Kategori_ID==ID).ToList();
}
public JsonResult GetCountries()
{
var getir = this.kat();
var gonder = getir.Select(m => new SelectListItem() {
Text=m.Baslik,
Value=m.ID.ToString(),
});
return Json(gonder, JsonRequestBehavior.AllowGet);
}
public JsonResult GetStatesByCountryId(string countryId)
{
int id = Convert.ToInt32(countryId);
var getir = this.urun(id);
var gonder = getir.Select(m => new SelectListItem()
{
Text = m.Baslik,
Value = m.ID.ToString(),
});
return Json(gonder, JsonRequestBehavior.AllowGet);
}
public JsonResult ilceChanged(string ilceId)
{
int _ilceId = Convert.ToInt32(ilceId);
urunler ilce = db.urunlers.FirstOrDefault(i => i.ID == _ilceId);
var states = ilce.Baglanti_URL_Cek;
return Json(states);
}
kodlar da bu şekilde. takıldığınız bir nokta olduğunda yorum kısmından yardım talep edebilirsiniz.
