ইন্টারনেট এক্সপ্লোরার 9 টি টেবিল কোষগুলি সঠিকভাবে উপস্থাপন করছে না


115

আমার ওয়েবসাইটটি সর্বদা আইই 8, আই 7, এফএফ, ক্রোম এবং সাফারি দিয়ে সুচারুভাবে চালিত হয়েছে। এখন আমি এটি আই 9 তে পরীক্ষা করছি এবং আমি একটি অদ্ভুত সমস্যাটি অনুভব করছি: কিছু পৃষ্ঠায় কিছু ট্যাবুলার ডেটা ভুলভাবে রেন্ডার করে।

এইচটিএমএল উত্সটি সঠিক এবং সমস্ত, এবং প্রতিবার পৃষ্ঠাটি রিফ্রেশ করার সময় সমস্যাটি প্রদান করার সারিটি পরিবর্তিত হয় (সত্য বলার জন্য, সমস্যাটি কেবল কিছুটা রিফ্রেশেই উপস্থিত হয়, সমস্ত নয়)।

আই এর এফ 12 সরঞ্জামটি ব্যবহার করে টেবিলের কাঠামোটি সঠিকভাবে উপস্থিত হয়, এমডি 8000007448 টিডি থাকা টিডির পরে কোনও খালি টিডি থাকা উচিত নয়, তবুও এটি এটির মতো রেন্ডার করে।

তদুপরি, যদি আমি সরঞ্জামদণ্ডে "ক্লিক করে উপাদান নির্বাচন করুন" সরঞ্জাম সহ এফ 12 সরঞ্জামটি ব্যবহার করি এবং আমি M08000007448 এবং 19 এর মধ্যে ফাঁকা জায়গায় ক্লিক করার চেষ্টা করি তবে এটি টিআর নির্বাচন করে, একটি "লুকানো টিডি" নয়।

আমি এই টেবিলটি রেন্ডারিংয়ের সমস্যায় আছি অ্যাপ্লিকেশনের অন্য কোনও টেবিলটিতেও, কেউ এরকম কিছু অনুভব করছে? এটি কেবল আইই 9 এ ঘটে :(

এটি গুরুত্বপূর্ণ কিনা আমি জানি না, তবে পৃষ্ঠাটি এএসপনেট (ওয়েবফর্ম) দিয়ে তৈরি হয়েছে এবং জ্যাকুয়ারি এবং কিছু অন্যান্য জেএস প্লাগইন ব্যবহার করুন।

আমি পৃষ্ঠাটি (চিত্র সহ) সংরক্ষণ করার চেষ্টা করেছি এবং আইই 9 এর সাথে স্থানীয়ভাবে এটি খোলার চেষ্টা করেছি, তবে সমস্যাটি কখনও ঘটে না। (অবশ্যই আমি সমস্ত টেবিলের কাঠামো পরীক্ষা করেছি এবং এটি ঠিক আছে Head হেডার এবং সমস্ত সারিগুলিতে প্রয়োজনের সময় ডান সংখ্যক কলসপান সহ টিডি'র সমান সংখ্যা রয়েছে)।


কোন কোড? হয়ত আপনার কোথাও কোনও মিল নেই?
নফতালি ওরফে নীল

আপনি কি IE9 F12 সরঞ্জাম ব্যবহার করে এইচটিএমএলকে বৈধতা দিতে সক্ষম? আইই 9 আপনাকে কী মোডে উপস্থাপন করছে তা বলে? কুইর্কস মোড, আইই 7, আইই 8, আইই 9 স্ট্যান্ডার্ডস (ডিফল্ট) ইত্যাদি ...
ড্যান সোরেেনসেন

আইই ব্লগ আইই 9 অসঙ্গতি সমস্যা সমাধানে আজ একটি নতুন সরঞ্জামের কথা উল্লেখ করেছে: ব্লগস.এমএসডিএন
ড্যান

কোডটি আসলেই দীর্ঘ, আমি মনে করি না সমস্যা আছে। F12 সরঞ্জামের সাথে কোনও ত্রুটি পাওয়া যায় নি, এবং রেন্ডারিং মোডটি আই 9। আমি কমপ্যাট ইন্সপেক্টরটি চেষ্টা করেছিলাম এবং আপনাকে জানাতে পারি;) আমি ট্যাগ মিসম্যাচগুলির জন্যও পরীক্ষা করেছিলাম (প্রথম কাজটি আমি করেছি) তবে ভাগ্য নেই
fgpx78

বিটিডাব্লু, আমি সমস্যাটি পেয়েছি: মনে হচ্ছে হেড ট্যাগের আগে কিছু জাভাস্ক্রিপ্ট কোড সমস্যা সৃষ্টি করছিল। আইই 9 এটি ভালভাবে পরিচালনা করছে না বলে মনে হচ্ছে ... ... এটি একটি সমস্যা যেহেতু আমি এমভিসি সমস্যাটি স্লাইভ করেছিলাম তাই আমি পুরানোটির কাছে ফিরে আসছি :) আপনাকে ধন্যবাদ।
fgpx78

উত্তর:


72

এখানে চিত্র বর্ণনা লিখুনআমারও ঠিক একই সমস্যা আছে। আপনি এই https://connect.microsoft.com/IE/feedback/details/649949/innerhtml-formatting-issues-on-very-large-tables এই পড়তে চাইতে পারেন

আপনি যদি জাভাস্ক্রিপ্ট ব্যবহার করে আপনার এইচটিএমএলটি অজ্যাক্স থেকে ফিরে আসে, তবে প্রতিক্রিয়া থেকে, আপনি স্থানটি অভ্যন্তরীণ টিডি টি জাভা স্ক্রিপ্ট ব্যবহার করে সরিয়ে ফেলতে পারেন

response_html = response_html.replace(/td>\s+<td/g,'td><td');
$('#table').html(response_html);

এই সমাধানটি আমার সমস্যার সমাধান করেছে। আমি এই সমাধানটি খুঁজে পাওয়ার আগে এটি আমাকে শান্ত একটি ধাঁধা দিয়েছে।
বিয়ারউল্ফ

লিঙ্কটি আর উপলব্ধ নেই।
ম্যাসন 240

এটি এখনও উপলব্ধ। সামগ্রীগুলি দেখতে আপনার অবশ্যই লগইন করতে হবে। আমি মাত্র একটি স্ক্রিনশট নিয়েছি। আপনি আমার উত্তরের স্ক্রিনশটটি পেতে পারেন
শ্যানিসন

আমি & nbsp যোগ করেছি; খালি কোষে।
বকুদান

আপনি যদি
অজ্যাক্স

33

আমার একই একই সমস্যাটি ছিল jquery টেমপ্লেটগুলি ব্যবহার করে একটি টেবিল পপুলেট করা। আমি <td>কেবলমাত্র আইই 9 তে আরও বড় ডেটাসেটগুলিতে (300+) 'ভুত' রেখেছি । এগুলি <td>আমার টেবিলের সীমানার বাইরে বাইরের কলামগুলিকে ধাক্কা দেবে।

আমি সত্যিই নির্বোধ কিছু করে এটি স্থির করেছি; <td>শুরু এবং শেষ ট্যাগযুক্ত সমস্ত স্পেস মুছে ফেলা এবং আমার টেবিলের সাথে সম্পর্কিত HTML মার্কআপকে ন্যায্যতা বানাতে । মূলত, আপনি আপনার সমস্ত <td> </td>একই লাইনে চান, কোনও স্থান নেই।

উদাহরণ:

<table>
<tr class="grid_customer_normal">
<td>${primary}</td>
<td>${secondary}</td>
<td>${phone}</td>
<td>${address}</td>
</tr>
</table>

ধন্যবাদ, সমস্যাটি আবার যদি ঘটে তবে আমি এটি চেষ্টা করব। জেনে খুশি হলাম আমি যদিও এটির একমাত্র ব্যক্তিই নই;)
fgpx78

4
কি? (এটি ছিল আমার প্রথম প্রতিক্রিয়া)। কিন্তু এটা কাজ! তোমাকে অনেক ধন্যবাদ!
ফিলিপা লেসারদা

1
আমার জন্য কাজ অনেক ধন্যবাদ আপনাকে! আপনার জন্য +1
সৌরভ বায়ানী

আপনি স্যার, আপনি দুর্দান্ত! :-)
সত্য

এই জন্য আপনাকে অনেক ধন্যবাদ! <td> শুরু এবং শেষ ট্যাগের মধ্যে থাকা সমস্ত স্থান সরিয়ে ফেলা বাস্তবে কার্যকর হয়েছিল।
ফ্র্যাঙ্কি লসকাভিও

14

@ শ্যানিসন প্রদত্ত সমাধানটি কেবলমাত্র আংশিকভাবে সহায়তা করে তবে থ্যাড, থ্যা ইত্যাদি ইত্যাদির মতো টেবিল সামগ্রী সামগ্রীর অংশ হতে পারে এমন অন্যান্য উপাদানগুলির মধ্যে ফাঁকা থাকলে সমস্যাটি অব্যাহত থাকে the

এখানে আমার নেতৃত্বের কর্মক্ষেত্রে আরও ভাল একটি রেগেক্স তৈরি করা হয়েছে।

if (jQuery.browser.msie && jQuery.browser.version === '9.0')
{
    data = data.replace(/>\s+(?=<\/?(t|c)[hardfob])/gm,'>');
}

সমস্ত টেবিল, ক্যাপশন, কলগ্রুপ, কর্নেল, টডি, থ্যাড, টিফুট, টিআর, টিডি, থিম উপাদানগুলি coveringেকে রাখা।

দ্রষ্টব্য: jQuery.browser jQuery 1.9 এ সরানো হয়েছিল এবং কেবল jQuery.migrate প্লাগইন এর মাধ্যমে উপলব্ধ। পরিবর্তে বৈশিষ্ট্য সনাক্তকরণ ব্যবহার করার চেষ্টা করুন।


11

সাদা সমস্যাটি সরিয়ে আমি এই সমস্যাটি সমাধান করেছি:

var expr = new RegExp('>[ \t\r\n\v\f]*<', 'g');
var response_html_fixed = data.replace(expr, '><'); //A disgusting hack for ie9. Removes space between open and close <td> tags
$('#treegrid-data').replaceWith(response_html_fixed);

2

আইই ব্লগ আজ একটি নতুন সরঞ্জামের উল্লেখ করেছে যার অর্থ কমপ্লেট ইন্সপেক্টর স্ক্রিপ্ট বলা হয় 9 9 রেন্ডারিং অসঙ্গতাকে সমস্যা সমাধানের জন্য। এটি আপনার সমস্যা সমাধানে সহায়তা করতে পারে।

http://blogs.msdn.com/b/ie/archive/2011/04/27/ie9-compat-inspector.aspx


সরঞ্জামটির সাথে কিছু খুঁজে পেল না। এস্পনেট ইঞ্জিনের রেন্ডারিংয়ের কারণে (শিরোনামে কিছু মেটা এবং লিঙ্ক ট্যাগের জন্য) অনুপস্থিত / শেষ হওয়ার কারণে কেবলমাত্র প্রচুর বৈধতা সমস্যা।
fgpx78

2

আমারও সেই সমস্যা ছিল।

এটা আমার কাছে ঘটেছে, যে প্রস্থ অ্যাট্রিবিউট মধ্যে TD / তম ট্যাগ causng এই সমস্যা।

এটি স্টাইল = "প্রস্থ: XXpx" এ পরিবর্তন করা হয়েছে এবং সমস্যার সমাধান হয়েছে :)


2

আমিও এই সমস্যায় পড়েছি এবং আমি বুঝতে পেরেছি যে যখন আমি সরাসরি <td>উপাদানগুলিতে টেক্সট রাখছিলাম তখন এটি ঘটেছিল । এটি মানক কিনা তা আমি নিশ্চিত নই তবে কোনও পাঠ্য মোড়ানোর পরে<span> উপাদানগুলিতে , রেন্ডারিংয়ের বিষয়গুলি অদৃশ্য হয়ে গেল।

এর পরিবর্তে:

<td>gibberish</td>

চেষ্টা করে দেখুন:

<td><span>gibberish</span></td>

আমি এই সমাধানটি পছন্দ করি। এটি সমস্ত উপাদানগুলির মধ্য থেকে সাদা-স্থান সরে যাওয়ার চেয়ে আরও সোজা-এগিয়ে।
তদ্ব্যতীত

2

রেন্ডারিংয়ের সময় আপনার এইচটিএমএল টেবিলের অবাঞ্ছিত ঘরগুলি রোধ করতে খুব দরকারী স্ক্রিপ্ট পেয়েছে।

function removeWhiteSpaces()
{
   $('#myTable').html(function(i, el) {
      return el.replace(/>\s*</g, '><');
   });
}

পৃষ্ঠাটি লোড হওয়ার পরে এই জাভাস্ক্রিপ্ট ফাংশনটি আপনাকে কল করা উচিত (অর্থাত্‍ লোড ইভেন্ট)


1

দেরিতে উত্তর, তবে আশা করি আমি এটির সাহায্যে কাউকে সহায়তা করতে পারি। আইই 9-এ ডিবাগ করার সময় আমি একই সমস্যাটি অনুভব করেছি। সমাধানটি HTML কোডের সমস্ত শ্বেতস্পেস সরিয়ে ফেলছিল removing পরিবর্তে

<tr> <td>...</td> <td>...</td> </tr>

আমার করতেই হতো

<tr><td>...</td><td>...</td></tr>

এতে সমস্যার সমাধান হয়েছে বলে মনে হচ্ছে!


0

এটি আইই 9-র মধ্যে অত্যন্ত গুরুতর বাগ। আমার ক্ষেত্রে বিভিন্ন টিডির মধ্যে কেবল সাদা স্পেসগুলি অপসারণই যথেষ্ট ছিল না, তাই আমি বিভিন্ন টিআর এর মধ্যে ফাঁকা স্থানও সরিয়েছি। এবং এটা ঠিক কাজ করছে।


0

ডায়নামিক টেবিল উপস্থাপন করার সময় আমার যেমন -9-তে একই সমস্যা ছিল।

var table = $('<table><tr><td style="width :100"></td></tr></table>');

যখন অনুবাদিত হয় ...

<table><tbody><tr><td style="width :100px"></td></tr></tbody></table>

এটি = 10 ক্রোম সাফারিতে পুরোপুরি সূক্ষ্মভাবে কাজ করে ...

 //   but for ie-8 it renders to... with a style attr in my case

 <table><tbody><tr><td ></td></tr></tbody></table>

আপনি 100pxপরিবর্তে লিখতে হবে 100


0

Ie9 এর সাথে একই ফর্ম্যাটিং ইস্যু রয়েছে এবং ie11 এ একটি নতুন সমস্যা রয়েছে যেখানে এটি সঠিকভাবে ফর্ম্যাট করে তবে প্রায় 400 সারি এবং 9 কলামের একটি সারণী রেন্ডার করতে 25-40 সেকেন্ড সময় লাগে। টিআর বা টিডি ট্যাগের ভিতরে এর একই কারণ, সাদা স্থান।

আমি একটি টেবিল প্রদর্শন করছি যা একটি এজেএক্স কল থেকে আংশিক দেখার উপস্থাপনের মাধ্যমে তৈরি করা হয়েছে। আমি এখানে পোস্ট করা একটি পদ্ধতি ব্যবহার করে রেন্ডার আংশিক দৃশ্য থেকে সাদা স্থানটি সরিয়ে সার্ভারে এটি BFH করার সিদ্ধান্ত নিয়েছি: http://optimizeasp.net/remove-whitespace-from-html

এটিই তার সমাধানটি অনুলিপি করা হয়েছে:

    private static readonly Regex RegexBetweenTags = new Regex(@">(?! )\s+",     RegexOptions.Compiled);
    private static readonly Regex RegexLineBreaks = new Regex(@"([\n\s])+?(?<= {2,})<", RegexOptions.Compiled);
    private static string RemoveWhitespaceFromHtml(string html)
    {

        html = RegexBetweenTags.Replace(html, ">");
        html = RegexLineBreaks.Replace(html, "<");
        return html.Trim();

    }

এবং এখানে এমন একটি পদ্ধতি যা অন্য এসও উত্তর থেকে চুরি হয়ে স্ট্রিং হিসাবে আংশিক দৃষ্টিভঙ্গি প্রদান করে:

public string RenderPartialViewToString(string viewName, object model)
    {
        this.ViewData.Model = model;
        try
        {
            using (StringWriter sw = new StringWriter())
            {
                ViewEngineResult viewResult = ViewEngines.Engines.FindPartialView(this.ControllerContext, viewName);
                ViewContext viewContext = new ViewContext(this.ControllerContext, viewResult.View, this.ViewData, this.TempData, sw);
                viewResult.View.Render(viewContext, sw);
                return RemoveWhitespaceFromHtml(sw.ToString());
            }
        }
        catch (Exception ex)
        {
            //logger here
        }
    }

এটি প্রায় 400 সারিগুলির একটি টেবিল রেন্ডার করতে এক সেকেন্ডেরও কম সময় নেয়, যা আমার উদ্দেশ্যে যথেষ্ট ভাল।


0

মাঝে মাঝে নকআউট দ্বারা উত্পাদিত টেবিলগুলিতে আমার এই সমস্যা ছিল। আমার ক্ষেত্রে আমি এখানে পাওয়া jQuery সমাধান ব্যবহার করে এটি ঠিক করেছি

jQuery.fn.htmlClean = function() {
    this.contents().filter(function() {
        if (this.nodeType != 3) {
            $(this).htmlClean();
            return false;
        }
        else {
            this.textContent = $.trim(this.textContent);
            return !/\S/.test(this.nodeValue);
        }
    }).remove();
    return this;
}

-1

আইই 10 তে কেন্ডোআইআই গ্রিডের সাথে আমার একই সমস্যা ছিল। আমি আইকে এই হ্যাকের সাহায্যে নিখোঁজ টেবিল কোষগুলি পুনরায় সরবরাহ করতে বাধ্য করতে সক্ষম হয়েছিল:

htmlTableElement.appendChild(document.createTextNode(''));

একটি খালি পাঠ্য নোড যুক্ত করা আইআইকে পুরো টেবিলটি পুনরায় সরবরাহ করতে সক্ষম করে।

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