تفاوت DOM , BOM درچیست ؟

DOM : Document Object Model

BOM : Browser Object Model

DOM : با استفاده از این ساختار html به صورت ساختار درختی میشودکه میتوان به راحتی به element های آن دسترسی پیدا کرد

BOM:

به javascript این امکان رو میده که با خود مرورگر بتونه تعامل داشته باشه. مثل: ()window.open

‌ ‌BOM از DOM کلان تر هست در کد میتوان بهتردرک نمود

window.document.getElementById("header");

#is the same as:

document.getElementById("header");

 

نکته ای برای ذخیره سازی و بر روز رسانی روابط پیچیده در جانگو

Writable nested representations

نکته ای که داره اینه میگه آقا اگر شما یه ابجکت تو در تو داشتی که قیمه های اون داخل ماستا شده بود باید مرحله به مرحله بیای برای ذخیره سازی اون اقدام کنی مثلا

# sample 1
{	
	"title":"123 fucking update",
	"description":"test",
	"meta_title" : "meta title",
	"meta_description": "meta description",
	"category":4, #foreign key
	"person_ids":[1,2,3],  #m2m
	"image":6 #foreign key
}


# OR 
# sample 2
{
    "title":"123 fucking update",
	"description":"test",
	"meta_title" : "meta title",
	"meta_description": "meta description",
    "author":[
               {name:'ali',age:'20'}
              ,{name:'ali',age:'20'}
             ]

}

 

دستور ajax در jquery

سلام سریع بریم سراغ اصل مطلب 

$.ajax({
            url: "http://127.0.0.1:8000/api/post_admin/new_test/",
            type: "patch",
            contentType: "application/json",
            data: JSON.stringify({	
                title:$('#post-title').val(),
                description:$('#post-slug').val(),
                meta_title : $('#post-description').val(),
                meta_description:  $('#post-metaDescription').val(),
                category: $('.select2_category').val(),
                // "person_ids":JSON.stringify($('.select2_person').val()),
                person_ids:$('.select2_person').val(),
                image:$('.select2_image').val(),
                status: $('#postStatusBtn').attr('status')
            }) ,
            dataType: "json",
            success: function (data) {
    
               console.log('yesssssssssssssssssssss offfffffffff course  ajax working')
              
            },
            error: function(jqXHR, textStatus, errorThrown) {
               console.log(textStatus, errorThrown);
            }
        },'json');

نکته stringfy کردن داده ها برای دریافت صحیح مقادیر در RDF

جایگزین پیشرفته select box ، کتابخانه select2

سلام وقت بخیر 

برای انجام یک پروژه نیاز داشتم  selectbox رو خیلی کاستوم کنم که با این کتابخونه آشنا شدم.خیلی خوبه آسونه اما شاید بعضی از جاهاش برای بار اول اذیتتون کنه اما خیلی چیز روالیه 

روش استفاده : بعد از اینکه cdn اون رو اضافه کردید با این چند خط کد میتونید اون رو داخل پروژه خودتون استفاده کنید.

$(".select2_category").select2({

        ajax: {
            url: "http://127.0.0.1:8000/api/categories/",
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    q: params.term, // search term
                    page: params.page
                };
            },
            processResults: function (data, params) {

                params.page = params.page || 1;

                return {
                    results: data.results,
                    pagination: {
                        more: (params.page * 18) < data.count
                    }
                };
            },
            cache: true
        },
        placeholder: 'انتخاب تصویر اصلی',
        templateResult: formatCategory,
        templateSelection: formatCategorySelection
    });

    function formatCategory(category) {
        if (category.loading) {
            return category.title;
        }
        return category.title || category.text;
    }

    function formatCategorySelection(category) {
        
    
        return category.title || category.text;
    } 

اضافه کردن selectboxدر کد html 

 <label>دسته بندی</label><br>
        <select class="form-control select2 select2_category"  style="width: 100%;">
  </select>

توضیحات بیشتر در دایکومنت select2

1 2 ... 4