ডেটা টেবিল: সংজ্ঞায়িত সম্পত্তি স্টাইল পড়তে পারে না

118

নিম্নলিখিতগুলির সাথে আমি এই ত্রুটিটি পাচ্ছি:

jquery.dataTables.js:4089 Uncaught TypeError: Cannot read property 'style' of undefined(…)
_fnCalculateColumnWidths @ jquery.dataTables.js:4089
_fnInitialise @ jquery.dataTables.js:3216
(anonymous function) @ jquery.dataTables.js:6457
each @ jquery-2.0.2.min.js:4
each @ jquery-2.0.2.min.js:4
DataTable @ jquery.dataTables.js:5993
$.fn.DataTable @ jquery.dataTables.js:14595
(anonymous function) @ VM3329:1
(anonymous function) @ VM3156:180
l @ jquery-2.0.2.min.js:4
fireWith @ jquery-2.0.2.min.js:4
k @ jquery-2.0.2.min.js:6
(anonymous function) @ jquery-2.0.2.min.js:6

উপরের লাইনটি (বেনামে ফাংশন) @ ভিএম 3156: 180 উল্লেখ করছে:

                TASKLISTGRID = $("#TASK_LIST_GRID").DataTable({
                    data : response,
                    columns : columns.AdoptionTaskInfo.columns,
                    paging: true
                });

সুতরাং আমি অনুমান করছি যেখানে এটি ব্যর্থ হচ্ছে।

এইচটিএমএল আইডি উপাদান বিদ্যমান:

  <table id="TASK_LIST_GRID" class="table table-striped table-bordered table-hover dataTable no-footer" width="100%" role="grid" aria-describedby="TASK_LIST_GRID_info">
  <thead>
    <tr role="row">
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Solution</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Status</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Category</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Type</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Due Date</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Create Date</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Owner</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Comments</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Mnemonic</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Domain</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Approve</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Dismiss</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>

এছাড়াও, কলামগুলি dঅডোপশনটাস্কআইএনফোও কলাম এবং প্রতিক্রিয়া অবজেক্ট অ্যারে বিদ্যমান। কী ভুল তা কীভাবে ডিবাগ করবেন তা নিশ্চিত নন .. কোনও পরামর্শ সহায়ক হবে ..

javascript  jquery  node.js  datatables 
— নূতন দ্যর্তি-করা সৈনিক
সূত্র
2
দেখুন .styleআপনার কোডে। আপনি একটি সংজ্ঞায়িত ভেরিয়েবলের সেই সম্পত্তিটি অ্যাক্সেস করার চেষ্টা করছেন। আপনি সেখান থেকে ডিবাগ করতে পারেন।
— জেকমস
80
আপনি যে কলামগুলির আনার চেষ্টা করছেন সেগুলি আপনার তৈরি <ম> সংখ্যার সমান কিনা তা পরীক্ষা করে দেখুন।
— ম্যাট্রিক্সগুই
12
জাভা স্ক্রিপ্টগুলিতে সংখ্যক কলামের সংখ্যার সাথে এই সমস্যাটির কারণ সংখ্যার সাথে মিল নেই।
— ধনুকা777

উত্তর:

284

সমস্যাটি হ'ল <<> ট্যাগের সংখ্যার সাথে কনফিগারেশনে কলামগুলির সংখ্যার (কী "কলামগুলি" সহ অ্যারে) মেলাতে হবে। যদি নির্দিষ্ট কলামগুলির তুলনায় <তম ট্যাগ কম থাকে তবে আপনি এটি কিছুটা ক্রিপ্টিক্যাল ত্রুটি বার্তা পাবেন।

(সঠিক উত্তরটি ইতিমধ্যে একটি মন্তব্য হিসাবে উপস্থিত রয়েছে তবে আমি এটি উত্তর হিসাবে পুনরাবৃত্তি করছি যাতে এটি সন্ধান করা সহজ - আমি মন্তব্যগুলি দেখিনি)

— ehrencrona
সূত্র
2
আমি আরেকটি বিষয় যুক্ত করতে চাই, লোকেরা হয়তো কোনও উপকারে এটি সহায়ক হতে পারে, আপনি যদি ডেটাএসসিআর সংজ্ঞায়িত না করেন তবে আপনার জসনে "ডেটা" ব্যবহার করুন, যদি আপনি অন্য নাম ব্যবহার করেন তবে আপনি এই ত্রুটি পাবেন।
— আহমেদ সানি
এছাড়াও, যদি আপনার কাছে কলামগুলি দৃশ্যমান নয় তবে অনুসন্ধান বা সম্পাদকের মতো বিষয়গুলির জন্য অন্তর্ভুক্ত থাকে তবে সেগুলি অবশ্যই আপনার কলামগুলির শেষে থাকতে হবে: [] তালিকা।
— টিম ডিয়ারবর্ন
অনেক অনেক ধন্যবাদ, আমি জাভাস্ক্রিপ্টগুলিতে বিস্মিত হয়েছি ..
— জিমিল চোকসী
24

সম্ভাব্য কারণ

  • সংখ্যা thটেবিল শরীরে কলামের সংখ্যা থেকে টেবিল হেডারের মধ্যে উপাদান অথবা পাদচরণ পৃথক বা ব্যবহার নির্ধারণ করা columnsবিকল্প।
  • thটেবিল শিরোনামের উপাদানগুলির জন্য অ্যাট্রিবিউট কলস্পান ব্যবহৃত হয় ।
  • columnDefs.targetsবিকল্পটিতে ভুল কলাম সূচক নির্দিষ্ট করা হয়েছে ।

SOLUTIONS

  • thসারণী শিরোনাম বা পাদলেখের মধ্যে যে উপাদানগুলির সংখ্যার সাথে columnsবিকল্পটিতে সংজ্ঞায়িত কলামগুলির সংখ্যার সাথে মেলে তা নিশ্চিত করুন ।
  • আপনি যদি colspanটেবিল শিরোনামে অ্যাট্রিবিউট ব্যবহার করেন তবে thপ্রতিটি কলামের জন্য আপনার কমপক্ষে দুটি শিরোনাম সারি এবং একটি অনন্য উপাদান রয়েছে তা নিশ্চিত করুন । আরও তথ্যের জন্য কমপ্লেক্স শিরোনাম দেখুন ।
  • আপনি যদি columnDefs.targetsবিকল্পটি ব্যবহার করেন তবে নিশ্চিত হয়ে নিন যে শূন্য-ভিত্তিক কলাম সূচী বিদ্যমান কলামগুলিকে বোঝায়।

লিংক

JQuery ডেটা টেবিলগুলি দেখুন : সাধারণ জাভাস্ক্রিপ্ট কনসোল ত্রুটিগুলি - TypeError: আরও তথ্যের জন্য অপরিজ্ঞিত সম্পত্তি 'স্টাইল' পড়তে পারে না ।

— Gyrocode.com
সূত্র
13

আপনি বলেছিলেন যে কোনও পরামর্শ সহায়ক হবে, সুতরাং বর্তমানে আমি আমার ডেটা টেবিলগুলি সমাধান করেছি "অপরিজ্ঞিত সমস্যাটির সম্পত্তি 'স্টাইল' পড়তে পারি না" তবে আমার সমস্যাটি মূলত ডেটা সারণী দীক্ষা পর্বের columnDefsবিভাগে ভুল সূচকগুলি ব্যবহার করে । আমি 9 টি কলাম পেয়েছি এবং সূচকগুলি 0, 1, 2, .., 8 হয় তবে আমি 9 এবং 10 এর জন্য সূচকগুলি ব্যবহার করছিলাম তাই ভুল সূচক ইস্যুটি ঠিক করার পরে দোষটি অদৃশ্য হয়ে গেছে। আশা করি এটা কাজে লাগবে.

সংক্ষেপে, আপনি আপনার কলামগুলির পরিমাণ এবং সূচিগুলি সর্বত্রই সামঞ্জস্যপূর্ণ দেখতে পেয়েছেন।

বগি কোড:

    jQuery('#table').DataTable({
        "ajax": {
            url: "something_url",
            type: 'POST'
        },
        "processing": true,
        "serverSide": true,
        "bPaginate": true,
        "sPaginationType": "full_numbers",
        "columns": [
            { "data": "cl1" },
            { "data": "cl2" },
            { "data": "cl3" },
            { "data": "cl4" },
            { "data": "cl5" },
            { "data": "cl6" },
            { "data": "cl7" },
            { "data": "cl8" },
            { "data": "cl9" }
        ],
        columnDefs: [
            { orderable: false, targets: [ 7, 9, 10 ] } //This part was wrong
        ]
    });

স্থির কোড:

    jQuery('#table').DataTable({
        "ajax": {
            url: "something_url",
            type: 'POST'
        },
        "processing": true,
        "serverSide": true,
        "bPaginate": true,
        "sPaginationType": "full_numbers",
        "columns": [
            { "data": "cl1" },
            { "data": "cl2" },
            { "data": "cl3" },
            { "data": "cl4" },
            { "data": "cl5" },
            { "data": "cl6" },
            { "data": "cl7" },
            { "data": "cl8" },
            { "data": "cl9" }
        ],
        columnDefs: [
            { orderable: false, targets: [ 5, 7, 8 ] } //This part is ok now
        ]
    });
— বাহাদির তাসদেমির
সূত্র
ধন্যবাদ, এটি আমাকে বাঁচিয়েছে। আমি "aTargets" ব্যবহার করুন: [7], ত্রুটি তার চলতে চলতে তাই হয়, না সূচক 7. সঙ্গে কলাম বিদ্যমান Cuz সেখানে আছে legacy.datatables.net/usage/columns
— fudu
1
দুর্দান্ত আমি খুশি যে আমার উত্তরটি আপনার সমস্যার সমাধান করেছে, + ভোট দয়া করে
— বাহাদির তাসਦੇমির
10

colspanটেবিল শিরোনাম সেট করার সময় আমার এই সমস্যাটি ছিল । সুতরাং আমার টেবিলটি ছিল:

        <thead>
            <tr>
                <th colspan="2">Expenses</th>

                <th colspan="2">Income</th>

                <th>Profit/Loss</th>
            </tr>
        </thead>

তারপরে একবার আমি এটিকে পরিবর্তন করব:

        <thead>
            <tr>
                <th>Expenses</th>
                <th></th>
                <th>Income</th>
                <th></th>
                <th>Profit/Loss</th>
            </tr>
        </thead>

সবকিছু ঠিকঠাক কাজ করেছে।

— JustLearning
সূত্র
4

আপনার ইনপুট ডেটাতে response[i]এবং response[i][j], undefined/ না তা নিশ্চিত করুন null।

যদি তা হয় তবে তাদের "" দিয়ে প্রতিস্থাপন করুন।

— ডেভিড আই সামুদিও
সূত্র
3

নতুন (অন্য) টেবিল আঁকার সময়ও এটি ঘটতে পারে। আমি এটি পূর্ববর্তী টেবিলটি সরিয়ে প্রথমে সমাধান করেছি:

$("#prod_tabel_ph").remove();

— অতিথি
সূত্র
2

সমাধান বেশ সহজ। 

  <table id="TASK_LIST_GRID" class="table table-striped table-bordered table-hover dataTable no-footer" width="100%" role="grid" aria-describedby="TASK_LIST_GRID_info">
  <thead>
    <tr role="row">
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Solution</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Status</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Category</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Type</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Due Date</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Create Date</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Owner</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Comments</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Mnemonic</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Domain</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Approve</th>
      <th class="sorting" tabindex="0" aria-controls="TASK_LIST_GRID" rowspan="1" colspan="1">Dismiss</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>
স্নিপেট প্রসারিত করুন

                TASKLISTGRID = $("#TASK_LIST_GRID").DataTable({
                    data : response,
                    columns : columns.AdoptionTaskInfo.columns,
                    paging: true
                });
                
                //Note: columns : columns.AdoptionTaskInfo.columns has at least a column not definded in the <thead>
স্নিপেট প্রসারিত করুন

দ্রষ্টব্য : কলামগুলি: কলামগুলি d

— স্ট্যানলে ওকপালা নওসা
সূত্র
1

মজাদারভাবে আমি এক ত্রয়োদশতম জোড় থাকার জন্য নিম্নলিখিত ত্রুটিটি পেয়েছিলাম এবং এখনও গুগল আমাকে এখানে নির্দেশনা দিয়েছে। আমি এটি লিখিত রেখে দেব যাতে লোকেরা এটি খুঁজে পেতে পারে।

jquery.dataTables.min.js:27 Uncaught TypeError: Cannot read property 'className' of undefined
at ua (jquery.dataTables.min.js:27)
at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:127)
at Function.each (jquery.min.js:2)
at n.fn.init.each (jquery.min.js:2)
at n.fn.init.j (jquery.dataTables.min.js:116)
at HTMLDocument.<anonymous> (history:619)
at i (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at Function.ready (jquery.min.js:2)
at HTMLDocument.K (jquery.min.js:2)
— টমসের গায়েট
সূত্র
0

আমার ক্ষেত্রে, আমি দুবার সার্ভার-পক্ষযুক্ত ডেটাটেবল আপডেট করেছিলাম এবং এটি আমাকে এই ত্রুটি দেয়। আশা করি এটি কাউকে সাহায্য করবে।

— Taian
সূত্র
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.