سلام
این رو نگاه کنید:
Javascript:
var CategoriyIds;
var Primary_CategoryId;
var Article_Tags;
function LoadItems() {
$.ajax({
type: "get",
async: true,
url: "/Articles/Items",
data: { lang: Number(ById('LanguageId').value) },
dataType: "json",
success: function (response) {
var temp = JSON.parse(response);
CategoriyIds = $("#CategoriyIds").select2({
data: temp.Categories
});
Primary_CategoryId = $("#Primary_CategoryId").select2({
data: temp.Categories
});
Article_Tags = $("#Article_Tags").select2({
data: temp.Tags
});
}
});
}
function LoadSelectedItems() {
var article_id = Number($('#ArticleId').val());
$.ajax({
type: "get",
async: true,
cache: false,
url: "/Articles/SelectedItems",
data: { ArticleId: article_id },
dataType: "json",
success: function (response) {
var temp = JSON.parse(response);
$(CategoriyIds).val(temp.Caregories).trigger("change");
$(Primary_CategoryId).val(temp.PrimaryCategory).tr igger("change");
$(Article_Tags).val(temp.Tags).trigger("change");
}
});
}
InitData();
function InitData() {
LoadItems();
LoadSelectedItems();
}
$(document).on('click', '#AddNewCategory', function (e) {
e.preventDefault;
$('#CreatorModal .modal-title').text('دسته جدید');
$('#CreatorModal .modal-body').load('/Categories/AddNewCategory');
$('#CreatorModal .modal-footer').attr('methodfor', 'category');
$('#CreatorModal').modal('show');
});
$(document).on('click', '#AddNewTag', function (e) {
e.preventDefault;
$('#CreatorModal .modal-title').text('تگ جدید');
$('#CreatorModal .modal-body').load('/Tags/AddNewTag');
$('#CreatorModal .modal-footer').attr('methodfor', 'tag');
$('#CreatorModal').modal('show');
});
$(document).on('click', '#Modal_Save', function (e) {
var methodfor = $('#CreatorModal .modal-footer').attr('methodfor');
var data = $('#CreatorModal .modal-body form').serialize();
if (methodfor === 'tag') {
AJAXTag(data);
}
else if (methodfor === 'category') {
AJAXCategory(data);
}
$('#CreatorModal .modal-body').innerHTML = '';
$('#CreatorModal').modal('hide');
});
function AJAXTag(data) {
$.ajax({
type: "post",
async: true,
url: '/Tags/JAddNew',
data: data,
dataType: "json",
success: function (response) {
if (response.message === 'ok') {
var newOption = new Option(response.text, response.id, false, false);
$(Article_Tags).append(newOption).trigger('change' );
$.notify({
message: '<strong>تگ با موفقیت اضافه شده</strong>'
}, {
type: 'success'
});
} else if (response.message === 'error') {
$.notify({
message: '<strong>تگ اضافه نشد</strong>'
}, {
type: 'warning'
});
}
}, error: function () {
$.notify({
message: '<strong>خطا - به برنامه نویس اطلاع دهید</strong>'
}, {
type: 'error'
});
}
});
}
function AJAXCategory(data) {
$.ajax({
type: "post",
async: true,
url: '/Categories/JAddNew',
data: data,
dataType: "json",
success: function (response) {
if (response.message === 'ok') {
var newOption = new Option(response.text, response.id, false, false);
var newOption1 = new Option(response.text, response.id, false, false);
Primary_CategoryId.append(newOption).trigger('chan ge');
CategoriyIds.append(newOption1).trigger('change');
$.notify({
message: '<strong>دسته با موفقیت اضافه شده</strong>'
}, {
type: 'success'
});
} else if (response.message === 'error') {
$.notify({
message: '<strong>دسته اضافه نشد</strong>'
}, {
type: 'warning'
});
}
}, error: function () {
$.notify({
message: '<strong>خطا - به برنامه نویس اطلاع دهید</strong>'
}, {
type: 'error'
});
}
});
}
function ById(id) {
return document.getElementById(id);
}
Controller:
#region JMethods
[HttpGet]
public async Task<JsonResult> Items(Language lang)
{
var queryCategory = await db.CategoryRepository.AsQueryable().Where(y => y.LanguageId == lang).Select(y => new { id = y.CategoryId, text = y.Name }).ToListAsync();
var queryTag = await db.TagRepository.AsQueryable().Where(y => y.LanguageId == lang).Select(y => new { id = y.TagId, text = y.Name }).ToListAsync();
var result = new { Categories = queryCategory, Tags = queryTag };
var json = Newtonsoft.Json.JsonConvert.SerializeObject(result );
return Json(json, JsonRequestBehavior.AllowGet);
}
[HttpGet]
public async Task<JsonResult> SelectedItems(int ArticleId)
{
var query = await db.ArticleRepository.AsQueryable().Include(y => y.Categories).Include(y => y.Tags).FirstOrDefaultAsync(y => y.ArticleId == ArticleId);
var result = new { PrimaryCategory = query.Primary_CategoryId, Caregories = query.Categories.Select(y => y.CategoryId), Tags = query.Tags.Select(y => y.TagId) };
var json = Newtonsoft.Json.JsonConvert.SerializeObject(result );
return Json(json, JsonRequestBehavior.AllowGet);
}
#endregion
View:
<div class="form-group"> @Html.LabelFor(model => model.CategoriyIds, htmlAttributes: new { @class = "control-label col-md-2" }) <div class="col-md-10"> <select class="form-control select2" id="CategoriyIds" name="CategoriyIds" multiple="multiple" data-placeholder="انتخاب دسته ها" style="width: 100%;"></select> @Html.ValidationMessageFor(model => model.CategoriyIds, "", new { @class = "text-danger" }) </div> </div>
<div class="form-group"> @Html.LabelFor(y => y.Primary_CategoryId, htmlAttributes: new { @class = "control-label col-md-2" }) <div class="col-md-10"> <select class="form-control select2" id="Primary_CategoryId" name="Primary_CategoryId" data-placeholder="انتخاب دسته اصلی" style="width: 100%;"></select> @Html.ValidationMessageFor(model => model.Primary_CategoryId, "", new { @class = "text-danger" }) </div> </div>
<div class="form-group"> @Html.LabelFor(model => model.Article_Tags, htmlAttributes: new { @class = "control-label col-md-2" }) <div class="col-md-10"> <select class="form-control select2" id="Article_Tags" name="Article_Tags" multiple="multiple" data-placeholder="انتخاب تگ ها" style="width: 100%;"></select> @Html.ValidationMessageFor(model => model.Article_Tags, "", new { @class = "text-danger" }) </div> </div>