یک نمونه AJAX - هیوادار

در یک پروژه پرتکرار از AJAX استفاده کردیم و یه نمونه پیچیده شو اینجا میزارم.

function this_func(dep_pk) {
	var CardDivision = $("#card-division");
	var CardDep = $("#card-department");
	var DepTitle = $("#dep-title")
	var servicesList = $("#services-list");
	servicesList.empty();
	
	$.ajax({
		url: "{% url 'doc:get_svcs_per_dep' dep_id=0 %}".replace("0", dep_pk),
		method: "GET",
		success: function(data) {
			CardDivision.hide();
			CardDep.removeAttr("hidden");
			DepTitle.text(Object.keys(data)[0])
			var services = data[Object.keys(data)[0]];

			for (var id in services) {
				servicesList.append(`
					<div class="col-3 card card-catalog text-center m-2 p-3" >
						<a href="/doc/${services[id]}/">${services[id]}</a>
					</div>
				`);
			}
		},
		error: function(xhr, status, error) {
			console.error("An error occurred:", status, error);
		}
	});
}

function this_func(dep_pk) {

var CardDivision = $("#card-division");

var CardDep = $("#card-department");

var DepTitle = $("#dep-title")

var servicesList = $("#services-list");

servicesList.empty();

$.ajax({

url: "{% url 'doc:get_svcs_per_dep' dep_id=0 %}".replace("0", dep_pk),

method: "GET",

success: function(data) {

CardDivision.hide();

CardDep.removeAttr("hidden");

DepTitle.text(Object.keys(data)[0])

var services = data[Object.keys(data)[0]];

for (var id in services) {

servicesList.append(`

<a href="/doc/${services[id]}/">${services[id]}</a>

</div>

`);

}

error: function(xhr, status, error) {

console.error("An error occurred:", status, error);

}

});

}

در کد بالا route زیر که مربوط به یک view توی جنگو هست صدا زده شده

url: "{% url 'doc:get_svcs_per_dep' dep_id=0 %}".replace("0", dep_pk),

1	url: "{% url 'doc:get_svcs_per_dep' dep_id=0 %}".replace("0", dep_pk),

این یک route مربوطه به جنگو هست که یک پارامتر به اسم dep_id هم میگیره. قسمت جالب این کد اینه که همین کد جاوااسکریپت با django template engine داره render میشه و بعد توسط .replcace اصلاح میشه

نمونه route و view رو هم در ادامه میبینید.

@login_required
def get_services_per_dep(request, dep_id):

    return JsonResponse({'foo':'bar'})
	
	
path("get-svcs/<int:dep_id>/", views.get_services_per_dep, name="get_svcs_per_dep"),

@login_required

def get_services_per_dep(request, dep_id):

return JsonResponse({'foo':'bar'})

path("get-svcs/<int:dep_id>/", views.get_services_per_dep, name="get_svcs_per_dep"),

دیدگاهتان را بنویسید لغو پاسخ