عدم نمایش چک باکس ها در نودهای پلاگین JsTree

با سلام

من میخوام بخش مجوز دسترسی کاربران را ایجاد بکنم. فایلهای jtree را به پروژه اضافه کردم وفایل css و jtree.js را هم رفرنس میدم و در ویو دقیقا همون کد ها و در اکشن هم کدهای مربوط به خواندن درخت رو مینویسم اما متاسفانه وقتی اجرا میکنم با وجود اینکه درخت را میخواند و میچیند اما چک باکس ها را جهت انتخاب نمایش نمی دهد اینطور بگم کلا آیکون مربوط به پوشه و چک باکس و غیره را نمایش نمیده و تنها چیزی که نمایش میده ساختار درختی هستش که اونم با دابل کلیک باید تک تک زیر مجموعه ها رو باز بکنی. عکس درخت ایجاد شده رو هم در پایین گذاشتم.

پلاگین checkbox رو هم اضافه میکنم تو jquery اما تاثیری ندارد. عرض کردم کلا آیکون ها رو نمایش نمیده تو درخت. هیچ خطای اسکریپتی هم ندارم

<script type="text/javascript">
    $(function () {
        
        $('#jstree').on("changed.jstree", function (data) {
            alert('salam');
                    var i, j;
                    var postedItems = [];
                    
                    j = data.selected.length;
                    for (i = 0; i < j; i++) {
                        var id = data.selected[i];
                        //Add the Node to thr Json Array
                        postedItems.push({
                            text: data.instance.get_node(data.selected[i]).text,
                            id: id,
                            //parents: data.node.parents[0]
                            parent: data.node.parents[0]
                        });
                    }
                    //Serialize the Json Array and save in HiddenField
                    $('#selectedItems').val(JSON.stringify(postedItems));
                }).jstree({
                    "core": {
                        "themes": {
                            "variant": "large"
                        },
                        "data": @Html.Raw(ViewBag.Json)
                        },
                    "checkbox": {
                        "keep_selected_style": false
                    },
                    "plugins": ["wholerow","checkbox"]
                });
            });
</script>

مجددا عرض میکنم درخت ایجاد میشه اما چک باکس نمیندازه. تمام مسیرهای مربوط یه سی اس اس و فایل jstree.js رو هم هزار بار بررسی کردم که شاید اشتباهی وجود داشته باشه اما نشد که نشد

ویرایش شده در جمعه 1 مرداد 1400 ساعت 23:48:40

مشخصات سوال کننده :

کاربر : rafetorabi امتیاز کاربر : 0 رتبه کاربر : 7082

دسته بندی : Asp.net Mvc جی کوئری Css

نظر ویرایش گزارش نشان

به این سوال امتیاز بدهید 0

تعداد بازدید این سوال : 2848

1 نظر

saedbfd : با سلام بهتره به جای اینکه از کدهای خودتون عکس قرار بدید کدهاتون رو توسط بخش مخصوص کد در ادیتور قرار بدید تا بشه تست کرد. چون کسی فرصت اینکه بشینه همه این کدها رو بنویسه و تست کنه و پاسخ بده نداره قطعا !!!

امتیاز کاربر : 1664 رتبه کاربر : 1 تاریخ ثبت : 11:11 1399/05/20

حذف

هوش مصنوعی

پاسخ هوش مصنوعی

برای نمایش چک باکس ها در پلاگین jsTree، باید مطمین شوید که تمامی تنظیمات لازم و پلاگین ها به درستی افزوده شده اند. از آن جایی که چک باکس ها در پلاگین های jsTree نیاز به لود صحیح فایل های CSS و JS دارند، ابتدا باید اطمینان حاصل کنید که این فایل ها به درستی رفرنس داده شده اند.

در زیر کد شما به همراه نکات پیشنهادی بررسی شده است:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.12/themes/default/style.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.12/jstree.min.js"></script>

در کد جاوا اسکریپت، مطمین شوید که `plugins` شامل `"checkbox"` باشد. همچنین، اطمینان حاصل کنید که `data` به درستی برای درخت تعیین شده است.

<script type="text/javascript">
    $(function () {
        $('#jstree').jstree({
            "core": {
                "themes": {
                    "variant": "large"
                },
                "data": @Html.Raw(ViewBag.Json)
            },
            "checkbox": {
                "keep_selected_style": false
            },
            "plugins": ["wholerow", "checkbox"]
        }).on("changed.jstree", function (data) {
            var i, j;
            var postedItems = [];
            j = data.selected.length;
            for (i = 0; i < j; i++) {
                var id = data.selected[i];
                postedItems.push({
                    text: data.instance.get_node(data.selected[i]).text,
                    id: id,
                    parent: data.node.parents[0]
                });
            }
            $('#selectedItems').val(JSON.stringify(postedItems));
        });
    });
</script>

همچنین، مطمین شوید که JSON دریافتی (ViewBag.Json) به درستی قالب بندی شده و ساختار درختی در آن موجود باشد. در صورتی که هنوز هم چک باکس ها نمایش داده نمی شوند، می توانید با استفاده از ابزارهای توسعه دهنده (Developer Tools) مرورگر خود، از کنسول (Console) بررسی کنید که آیا خطایی وجود دارد یا خیر.

در نهایت، اطمینان حاصل کنید که CSS مربوط به jsTree به درستی بارگذاری شده و هیچ CSS دیگری که ممکن است ظاهر چک باکس ها را تحت تاثیر قرار دهد، وجود ندارد.

به این پاسخ امتیاز بدهید 0

امتیاز: - رتبه: -

نظر ویرایش گزارش

پاسخ دهنده : fateme 23:17 1399/05/20

این که می فرمایید درخت تشکیل میشه ولی استایل خاصی نمایش نمیده مطمئن باشید توی لینک کردن فایل های Css مشکلی هست. شما بهتره پروژه رو اجرا کنید و بعد از اجرا دکمه Ctrl+U رو بزنید تا به بخش View Source برید.

حالا همه لینک های شما مشخص هست. روی لینک Css مربوط به پلاگین JsTree کلیک کنید ببینید این لینک رو میتونه بخونه یا نه.

ضمنا میتونید موقعی که درختتون تشکیل میشه F12 رو بزنید و در سربرگ Console ببینید خطایی وجود داره یا خیر

به این پاسخ امتیاز بدهید 0

امتیاز: 1635 رتبه: 2

نظر ویرایش گزارش

1 نظر

rafetorabi : بله لینک رو میخونه و با زدن f12 در کنسول هم هیچ خطایی مشاهده نمیشه واقعا گیج کننده هست

امتیاز کاربر : 0 رتبه کاربر : 7082 تاریخ ثبت : 08:28 1399/05/21

حذف

آخرین سوالات ثبت ‌شده

سوالات مرتبط

آموزش های پرطرفدار

برای ارسال پاسخ لطفا وارد حساب کاربری خود شوید. ورود

عدم نمایش چک باکس ها در نودهای پلاگین JsTree

پاسخ هوش مصنوعی

آموزش ساخت اتوماسیون اداری تحت وب

آموزش ساخت سیستم فروش و انبارداری وب

آموزش ساخت سیستم حقوق و دستمزد وب با سینکفیوژن

آموزش ساخت سیستم آزمونگیر آنلاین