বুটস্ট্র্যাপ মডেল অবিলম্বে অদৃশ্য হয়ে যায়

203

আমি বুটস্ট্র্যাপ ব্যবহার করে একটি ওয়েবসাইটে কাজ করছি।

মূলত, আমি হোম পৃষ্ঠায় একটি মডেল ব্যবহার করতে চেয়েছিলাম, হিরো ইউনিটের বোতামটি দ্বারা ডেকে আনা হয়েছিল।

বাটন কোড:

<button type="button" 
    class="btn btn-warning btn-large" 
    data-toggle="modal"
    data-target="#myModal">Open Modal</button>

মডেল কোড:

<div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">In Costruzione</h3>
  </div>
  <div class="modal-body">
    <p>Test Modal: Bootstrap</p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Chiudi</button>
    <button class="btn btn-warning">Salva</button>
  </div>
</div>

সমস্যাটি হ'ল আমি বোতামটিতে ক্লিক করার সাথে সাথে মডেলগুলি ম্লান হয়ে যায় এবং ততক্ষণে অদৃশ্য হয়ে যায়।

আমি কোনও সাহায্যের প্রশংসা করব

এছাড়াও, কীভাবে ড্রপডাউন ত্রিভুজটির রঙ পরিবর্তন করা যায় (পয়েন্টিং করা, কোনও হোভার নেই)? আমি কমলা এবং বাদামী উপর ভিত্তি করে একটি ওয়েবসাইটে কাজ করছি এবং যে নীল জিনিস সত্যিই বিরক্তিকর।

twitter-bootstrap modal-dialog

— gorokizu
সূত্র

1

আপনি টুইটার.github.com/bootstrap এ যেতে পারেন এবং এর উদাহরণগুলি অনুসরণ করতে পারেন ।

— মৌরিসিও জিওর্ডানো

2

আমি এটিকে ক্লিক করে অন ক্লিক করুন = "$ ('# মাইমোডাল')। বোতাম ট্যাগটিতে মডেল ()" ব্যবহার করে।

— গোরোকিজু

onclick =: আপনার পদ্ধতির ব্যবহার "$ ( '# myModal') মোডাল ()।"

— nikolai.serdiuk

467

একটি সম্ভাব্য কারণ

মোডাল প্লাগইনের জাভাস্ক্রিপ্ট যখন দু'বার লোড হয়ে যায় তখন এটির জন্য এটি সাধারণ আচরণ। প্লাগিনটি দ্বিগুণ লোড হচ্ছে না তা নিশ্চিত হয়ে দেখুন check আপনি যে প্ল্যাটফর্মটি ব্যবহার করছেন তার উপর নির্ভর করে মডেল কোডটি কোনও উত্স থেকে লোড করা যেতে পারে। সাধারণ কিছু হ'ল:

bootstrap.js (সম্পূর্ণ বুটস্ট্র্যাপ জেএস স্যুট)
bootstrap.min.js (উপরের মত একই, সবেমাত্র মাইনাইফড)
বুটস্ট্র্যাপ-মোডাল.জে (একক প্লাগইন)
একটি নির্ভরতা লোডার, যেমন, require('bootstrap')

ডিবাগিং টিপস

শুরু করার জন্য একটি ভাল জায়গা হ'ল clickআপনার ব্রাউজারে বিকাশকারী সরঞ্জামগুলি ব্যবহার করে নিবন্ধিত ইভেন্ট শ্রোতাদের পরীক্ষা করা । উদাহরণস্বরূপ, ক্রোম জেএস উত্স ফাইলের তালিকা তৈরি করবে যেখানে শ্রোতার রেজিস্ট্রেশন করার কোডটি পাওয়া যাবে। অন্য বিকল্পটি হল মোডাল কোডে পাওয়া একটি বাক্যাংশের জন্য পৃষ্ঠাতে উত্সগুলি অনুসন্ধান করার চেষ্টা করা, যেমন var Modal,।

দুর্ভাগ্যক্রমে, এগুলি সর্বদা সব ক্ষেত্রে জিনিসগুলি খুঁজে পাবে না। নেটওয়ার্কের অনুরোধগুলি পরীক্ষা করা আপনাকে কোনও পৃষ্ঠায় লোড হওয়া সমস্ত কিছুর একটি ছবি দেওয়ার ক্ষেত্রে আরও কিছুটা শক্তিশালী হতে পারে।

এ (ভগ্ন) ডেমো

আপনি বুটস্ট্র্যাপ.জেএস এবং বুটস্ট্র্যাপ-মোডাল.জেএস উভয়ই লোড করলে কী ঘটে যায় তার একটি ডেমো এখানে রয়েছে (কেবলমাত্র আপনার অভিজ্ঞতার বিষয়টি নিশ্চিত করার জন্য):

Plunker

যদি আপনি সেই পৃষ্ঠায় উত্সের নীচে স্ক্রল করে থাকেন তবে আপনি বুটস্ট্র্যাপ-মোডাল.জেএস এর<script> জন্য লাইনটি সরাতে বা মন্তব্য করতে পারেন এবং তারপরে যাচাই করতে পারেন যে এখন মডেলটি প্রত্যাশা অনুযায়ী কাজ করবে।

— মার্ভ
সূত্র

4

এটি আমার পক্ষে কাজ করেছে, আমি বুটস্ট্র্যাপ.জেএস মুছে ফেলেছি এবং বুটস্ট্র্যাপ.মিন.জেগুলি বামে রেখেছি + +1

— ড্যানিয়েল সান ইয়াং

1

আমার কাছে সবচেয়ে সুখের বিষয় হ'ল যে আমি <head> </head> এবং

— বুটের

@ প্রিন্সটাইক আপনি ঠিক বলেছেন, বুটস্ট্র্যাপ-মোডাল.জেএস এর ইউআরএল বাসি ছিল এবং সুতরাং কেবল একটি লোড হচ্ছে (এটি কাজ করে)। আমি আবার এটা ভাঙ্গা স্থির।

— মার্ভ

আপনি একই সাথে একই পৃষ্ঠায় দুটি "বুটস্ট্র্যাপ.জে" রাখলে এটিও ঘটে

— লেয়ানড্রো আরআর

1

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

— মূল্য 7

85

আমার একই সমস্যা ছিল তবে এটির একটি ভিন্ন কারণ ছিল। আমি ডকুমেন্টেশন অনুসরণ করেছি এবং এর মতো একটি বোতাম তৈরি করেছি:

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

আমি যখন এটি ক্লিক করেছি তখন মনে হয়েছিল কিছু ঘটবে না। তবে বোতামটি এমন <form>একটিতে ছিল যা সাময়িকভাবে একই পৃষ্ঠাটি আনছিল fet

আমি type="button"এটি বোতামের উপাদানটিতে যুক্ত করে ঠিক করেছি , যাতে ক্লিক করার সময় এটি ফর্মটি জমা না দেয়।

— ররি হান্টার
সূত্র

আমার দুটি লাইব্রেরি বুটস্ট্র্যাপ.জেএস এবং বুটস্ট্র্যাপ-এডিটেবল.জেএস ছিল, আমি বুঝতে পেরেছিলাম যে তারা একই লাইব্রেরি ছিল তাই আমি প্রথমটি মুছলাম এবং এখন সমস্ত কিছুই কাজ করে।

— ফেডেকো

25

আমার জন্য যা কাজ হয়েছিল তা অপসারণ করা

data-toggle="modal"

বোতাম থেকে। বোতাম নিজেই যে কোনও উপাদান হতে পারে - একটি লিঙ্ক, ডিভ, বোতাম ইত্যাদি

— miCRoSCoPiC_eaRthLinG
সূত্র

1

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

— ব্লুপ্রিন্টক্রিস

15

এই প্রশ্নের অন্যান্য সহায়ক উত্তরের পরে আমি আমার এমভিসি অ্যাপ্লিকেশনটিতে ডুপ্লিকেট বুটস্ট্র্যাপের রেফারেন্সের জন্য কিছুক্ষণ চেয়েছিলাম।

অবশেষে এটি খুঁজে পেল - এটি আমি ব্যবহার করছি এমন অন্য লাইব্রেরিতে এটি অন্তর্ভুক্ত ছিল, তাই এটি মোটেই স্পষ্ট ছিল না! ( datatables.net)।

আপনি যদি এখনও এই সমস্যাটি পান তবে আপনার জন্য বুটস্ট্র্যাপ সহ অন্যান্য গ্রন্থাগার সন্ধান করুন। ( datatables.netবুটস্ট্র্যাপের সাথে বা ছাড়াই আপনাকে একটি ডাউনলোড নির্দিষ্ট করার মঞ্জুরি দেয় - অন্যরাও এটি করে)।

তাই আমি এটিকে bootstrap.min.jsআমার থেকে সরিয়ে দিয়েছিলাম bundle.configএবং সমস্ত ভাল কাজ করে।

— জন লুকাস
সূত্র

দুর্দান্ত, এটি আমার মডেলগুলি দিয়ে সমস্যার সমাধান করেছে। আমি একমত যে এটা মোটেই সুস্পষ্ট ছিল না। ধন্যবাদ

— হারিস

13

একই লক্ষণ, bootstrap-sassরত্ন দ্বারা সরবরাহিত বুটস্ট্র্যাপের সাথে একটি রেল অ্যাপ্লিকেশন প্রসঙ্গে এবং @ মেরভের উত্তর আমাকে সঠিক পথে ফেলেছে।

আমার application.jsফাইলে নিম্নলিখিতটি ছিল:

//= require bootstrap
//= require bootstrap-sprockets

ঠিক করা ছিল দুটি লাইনের একটি অপসারণ করা। প্রকৃতপক্ষে, রত্নটির রেডমেটি আপনাকে এই ত্রুটি সম্পর্কে সতর্ক করে। আমার খারাপ।

— : Giuseppe
সূত্র

9

আমার কোডটিতে কোনওভাবে বুটস্ট্র্যাপ.মিন.জেস দুবার অন্তর্ভুক্ত ছিল। আমি তাদের একটি অপসারণ করেছি এবং সবকিছু এখন ঠিকঠাক কাজ করে।

— রিকার্ডো পাইপার
সূত্র

আমার ক্ষেত্রে আমি bootstrap.js এবং bootstrap.min.js উভয়ই যুক্ত করেছি

— ইমরাননাকভি

এই উত্তরটি আমাকে সহায়তা করেছিল, কেউ

— সিডিএন

8

e.preventDefault(); jquery ui সহ

আমার জন্য এই সমস্যাটি একটি jquery UI বোতামে ক্লিকের পদ্ধতিটি ওভাররাইডের ফলে ঘটেছিল, একটি পৃষ্ঠাটি ডিফল্টরূপে ক্লিকে পুনরায় লোডের কারণ হয়।

— LX-3
সূত্র

8

যদি jquery ব্যবহার করে আপনি ইভেন্ট শ্রোতাদের দু'বার সংযুক্ত করেন তবে সমস্যাটিও দেখা দিতে পারে। উদাহরণস্বরূপ আপনি আবদ্ধ না করে সেট করবেন:

            $("body").on("click","#fixerror",function(event){
                $("#fixerrormodal").modal('toggle')
            })

এটি ঘটলে ঘটনাটি পরপর দু'বার চালিত হয় এবং মডেলগুলি অদৃশ্য হয়ে যায়।

            $("body").on("click","#fixerror",function(event){
                $("#fixerrormodal").modal()
                $("#fixerrormodal").modal('toggle')
            })

উদাহরণ দেখুন: http://ebra.plnkr.co/i5xB1WbX7zgXrbDMhNAW/preview

— gpasse
সূত্র

3

@ করাদাই এটি কোনও 'ফিক্স' নয়, এমন ঘটনা ঘটতে পারে।

— গিপাসে

7

@ গ্যাপাস তার উদাহরণে যে একই লক্ষণটি দেখিয়েছিল আমি তাতে দৌড়লাম। এখানে আমার কোড ছিল ...

<form...>
  <!-- various inputs with form submit --->

  <!-- button opens modal to show dynamic info -->
  <button id="myButton" class="btn btn-primary">Show Modal</button>
</form>

<div id="myModal" class="modal fade" ...>
</div>

<script>
  $( '#myButton' ).click( function() {
    $( '#myModal' ).modal();
  )};
</script>

@ ভরগাভের পরামর্শ অনুসারে, আমার সমস্যাটি বোতামটি ফর্মটি জমা দেওয়ার চেষ্টা করার কারণে এবং পৃষ্ঠাটি পুনরায় লোড করার কারণে হয়েছিল। আমি নীচে <a>লিঙ্কে বোতামটি পরিবর্তন করেছি :

<a href="#" id="myButton" class="btn btn-primary">Show Modal</a>

... এবং এটি সমস্যার সমাধান করেছে।

দ্রষ্টব্য: আমার কাছে এখনও কোনও মন্তব্য যুক্ত করতে বা উত্সাহ দেওয়ার মতো যথেষ্ট খ্যাতি নেই এবং আমি অনুভব করেছি যে আমি কিছুটা স্পেসিফিকেশন যোগ করতে পারি।

— JDev
সূত্র

4

আমারও একই সমস্যা ছিল, তবে আমার জন্য এটি ঘটছিল কারণ আমার কাছে মডেল ফর্মের মধ্যে "জমা দিন" টাইপের একটি বোতাম ছিল। আমি বদলে গেছি

    <input  type='submit' name='submitname' id="partyBtn" value='Submit' title='Click to submit.'/>

প্রতি

    <input  type='button' name='submitname' id="partyBtn" value='Submit' title='Click to submit.'/>

এবং এটি অন্তর্ধানের বিষয়টি স্থির করেছে।

— ডগ
সূত্র

3

আমার ক্ষেত্রে, আমার কাছে কেবল একটি একক বুটস্ট্র্যাপ.জেএস, জ্যাকুয়ের.জেএস ফাইল অন্তর্ভুক্ত ছিল তবে এখনও এ জাতীয় ত্রুটি পাওয়া যায়, এবং বোতামের জন্য আমার কোডটি ছিল এরকম কিছু:

<script type="text/javascript">
$(document).ready(function(){
   $("#bttn_<?php echo $rnt['id'];?>").click(function(){
      $("#myModal_<?php echo $rnt['id'];?>").modal('show');
   });
});
</script>

আমি সরলভাবে e.preventDefault () যুক্ত করেছি; এটি এবং এটি কবজ মত কাজ।

সুতরাং, আমার নতুন কোডটি নীচের মতো ছিল:

<script type="text/javascript">
$(document).ready(function(){
  e.preventDefault();
  $("#bttn_<?php echo $rnt['id'];?>").click(function(){
     $("#myModal_<?php echo $rnt['id'];?>").modal('show');
  });
});
</script>

— মেকি সালারিয়া
সূত্র

1

হ্যাঁ, আমাকে শুধু বিট। ধন্যবাদ।

— জেরেমি হ্যারিস

3

আমি আজ নিজেই এই সমস্যাটি জুড়ে এসেছি এবং এটি কেবল ক্রোমে রয়েছে। কী আমাকে বুঝতে পেরেছিল এটি কোনও রেন্ডারিং ইস্যু হতে পারে। নির্দিষ্ট মডেলটিকে নিজের রেন্ডারিং লেয়ারে স্থানান্তর করা এটি সমাধান করেছে।

#myModal {
  -webkit-transform: translate3d(0, 0, 0);
}

— gmaliar
সূত্র

3

আমার ক্ষেত্রে, একটি বোতামে ক্লিক করার ফলে পৃষ্ঠাটি পুনরায় লোডের (চায়নি) হতে পারে।

এখানে আমার সংশোধন:

<button class="btn btn-success" onclick="javascript: return false;" 
data-target="#modalID" data-toggle="modal">deaktivieren</button>

— akop
সূত্র

আপনি একাধিক জেএস লাইব্রেরি লোড করলে এটিই সেরা পথ।

— ড্যানিয়েল ভুকাসোভিচ

2

আমার ক্ষেত্রে আমার actionlinkএমভিসিতে বোতামটি ব্যবহার হয়েছে এবং আমি এই সমস্যার মুখোমুখি হয়েছি, আমি উপরে এবং অন্যান্য অনেকগুলি সমাধানের চেষ্টা করেছি, তবে এখনও এই সমস্যার মুখোমুখি হয়েছি, তখন আমি কোডটিতে আমার ত্রুটিটি উপলব্ধি করতে পারি।

আমি জাভাস্ক্রিপ্ট ব্যবহার করে মডেল কল করেছি

 $('#ModalId').modal('show');

ত্রুটির আগে আমি এই বোতামটি ব্যবহার করেছি

<a href="" onclick="return Edit();" class="btn btn-primary">Edit</a>

এই বোতামটিতে href সম্পত্তিটির আমার কোনও মূল্য নেই তাই আমি সমস্যার মুখোমুখি।

তারপরে আমি এই বোতাম কোডটি এর মতো সম্পাদনা করি

 <a href="#" onclick="return Edit();" class="btn btn-primary">Edit</a>

তারপরে প্রথমটিতে # টি না থাকার কারণে সমস্যাটি কেবল একটি ত্রুটি সমাধান করা হবে।

এটি আপনার পক্ষে সহায়ক হবে কিনা তা দেখুন।

— সৌরভ সোলঙ্কি
সূত্র

2

তবুও আরেকটি কারণ / সমাধান! আমার জেএস কোডটি ছিল:

$("#show_survey").click(function() {
  $("#survey_modal").modal("show")
})

তবে আমার এইচটিএমএল কোডটি ইতিমধ্যে লিখেছিল:

<a class="small-text link" data-target="#survey_modal" data-toggle="modal" href="#" id="show_survey">Take a quick 7 question survey!</a>

সুতরাং এটি কীভাবে সদৃশ কোডটি প্রবেশ করিয়েছিল এবং মোডালটি তখন বন্ধ হয়ে যায় তা বন্ধ করার জন্য এটি অন্য অনুমতি। আমার ক্ষেত্রে, data-targetএবং data-toggleএইচটিএমএল অনুসারে বুটস্ট্র্যাপ ডকগুলি ইতিমধ্যে কাজ করতে মডেলকে ট্রিগার করে। জেএস কোড অতএব অপ্রয়োজনীয়, এবং যখন সরানো হয়, এটি কার্যকর হয়।

— জেমস
সূত্র

1

একটি প্রকল্পে কাজ করার ক্ষেত্রে আমারও একই সমস্যা ছিল। আমি বুটস্ট্র্যাপ ৩.১.০ ব্যবহার করছিলাম এটি বুটস্ট্র্যাপ ২.৩.২ এ ডাউনগ্রেডিংয়ের সমাধান করেছে।

— পূর্বে
সূত্র

1

আমারও সমস্যা ছিল, বোতামটি যদি ভিতরে থাকে ট্যাগের পরে মোডালটি একবার উপস্থিত হয় এবং শীঘ্রই যথেষ্ট অদৃশ্য হয়ে যায়, ফর্মটির বোতামটি আইসুই ঠিক করে দেয়। ধন্যবাদ আমি এই থ্রেডে শেষ! সবার কাছে +1।

— Satheeshwaran
সূত্র

1

মোবাইল ডিভাইসগুলিতে পরীক্ষার সময় আমি একই সমস্যার মুখোমুখি হয়েছিলাম এবং এই কৌশলটি আমার পক্ষে কাজ করেছিল

<a type="submit" class="btn btn-primary" data-toggle="modal" href="#myModal">Submit</a>

অ্যাঙ্কর ট্যাগটিতে এটি ব্যবহার করা উচিত বলে বোতামটি পরিবর্তন করুন, সমস্যাটি তার টাইপ বোতামটির কারণে ঘটে কারণ এটি জমা দেওয়ার চেষ্টা করার ফলে মডেলটি তাত্ক্ষণিকভাবে অদৃশ্য হয়ে যায় and এবং মোডাল হাইড ফিড থেকে আড়ালও সরিয়ে দেয় <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> আশা করি এটি আপনার পক্ষে কাজ করবে।

— Bhargav
সূত্র

উপরের @ ররিহান্টারের পরামর্শ অনুসারে, এই সমস্যাটি সমাধান type="submit"করার জন্য কেবল বোতামটির পরিবর্তন করা type="button"।

— রিচার্ড হাউয়ার

1

আমার ক্ষেত্রে, আমি অ্যাপ্লিকেশন html.erb এর শিরোনামে সিডিএন অন্তর্ভুক্ত করেছি এবং 'জকিউরি-রেলস' রত্নটিও ইনস্টল করেছি, যা আমি ডকুমেন্টেশন এবং উপরের পোস্টগুলির জন্য ধন্যবাদ অনুমান করছি, এটি অপ্রয়োজনীয়।

আমি কেবল অ্যাপ্লিকেশন html.erb এর মাথা থেকে সিডিএন (নীচে) মন্তব্য করেছি এবং মডেলটি যথাযথভাবে উন্মুক্ত থাকে।

<!--<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>-->

— brntsllvn
সূত্র

1

আমারও একই সমস্যা ছিল। আমার সমস্যাটি ছিল আমি একটি লিঙ্ক টিপতে এবং jquery সহ নিশ্চিতকরণের জন্য অনুরোধ করে মডেলটি প্রদর্শন করছিলাম।

নীচের কোডটি মডেলটি প্রদর্শন করেছে এবং যা অবিলম্বে অদৃশ্য হয়ে গেছে:

<a href="" onclick="do_some_stuff()">Hey</a>

আমি href এ '#' যুক্ত করে শেষ করেছি যাতে লিঙ্কটি কোথাও না যায় এবং এটি আমার সমস্যার সমাধান করে।

<a href="#" onclick="do_some_stuff()">Hey</a>

— উতুখ নামে
সূত্র

1

আপনি সরানোর চেষ্টা করেছেন?

data-dismiss="modal"

— JeffNhan
সূত্র

0

আমি জানি এটি পুরানো, তবে এখানে আরও একটি বিষয় যাচাই করার জন্য - আপনার কাছে কেবল একটি ডেটা-টার্গেট = বৈশিষ্ট্য রয়েছে তা নিশ্চিত করুন। আমি এটির সদৃশ করেছিলাম এবং ফলটি এই থ্রেড অনুসারে হয়েছিল।

— পিট
সূত্র

0

আমি bootstrapআমার প্রকল্পের মাধ্যমে যুক্ত করেছিলাম bower, তারপরে আমি bootstrap.min.jsফাইলটি এবং ফাইলটির পরে আমদানি করেছি modal.js। (মোডালটি খোলার বোতামটি কোনও ফর্মের অভ্যন্তরে রয়েছে)। আমি কেবল আমদানি সরিয়েছি modal.jsএবং এটি আমার পক্ষে কাজ করে।

— pableiros
সূত্র

0

যদি কেউ ডেটাটেবলের সাথে কোডিগনেটার 3 বুটস্ট্র্যাপ ব্যবহার করে।

নীচে কনফিগারেশন / সিআই_বুসট্রেপ.পিএফ-এ আমার ফিক্সটি দেওয়া আছে

//'assets/dist/frontend/lib.min.js',
//lib.min.js has conflict with datatables.js and i removed it replace with jquery.js
'assets/dist/frontend/jquery-3.3.1.min.js',
'assets/dist/frontend/app.min.js',
'assets/dist/datatables.js'

— ব্রাভো নেট
সূত্র

0

একই সমস্যার মুখোমুখি হতে হয়েছিল। কারণ হিসাবে একই @merv। ইস্যুটি পৃষ্ঠায় যুক্ত ক্যালেন্ডারের উপাদান সহ ছিল The উপাদানটি নিজেই ক্যালেন্ডার পপআপে ব্যবহৃত মডেল বৈশিষ্ট্য যুক্ত করে।

সুতরাং মডেল পপআপ ভাঙার কারণগুলি নিম্নলিখিতগুলির এক বা একাধিক হবে

একাধিক বুটস্ট্র্যাপ জেএস সংস্করণ / ফাইল লোড হচ্ছে (মিনিডেড ...)
বুটস্ট্র্যাপ ব্যবহার করা হয় যেখানে পৃষ্ঠাতে একটি বাহ্যিক ক্যালেন্ডার যুক্ত করা
পৃষ্ঠাটিতে কাস্টম সতর্কতা বা পপআপ লাইব্রেরি যুক্ত করা হচ্ছে
অন্য যে কোনও গ্রন্থাগার পপআপ আচরণ যুক্ত করে

— শান্ত কুমার
সূত্র

0

কৌণিক (5) এর সাথে কাজ করার সময়, আমি একই সমস্যার মুখোমুখি হই, তবে আমার ক্ষেত্রে আমি নিম্নলিখিত হিসাবে সমাধান করেছি:

component.html

<button type="button" class="btn btn-primary"  data-target="#myModal" 
(click)="showresult()">fff</button>

<div class="modal" id="myModal" role="dialog"  tabindex="-1" data-backdrop="false">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Modal title</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Modal body text goes here.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-primary">Save changes</button>
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>

component.ts

দ্রষ্টব্য: ts ফাইলটিতে jquery আমদানি করা দরকার "ঘোষিত var var: যে কোনও;"

  showresult(){
    debugger
    $('#myModal').modal('show');
  }

আমি যে পরিবর্তনগুলি করেছি:

বোতাম ট্যাগ থেকে "ডেটা-টগল =" মডেল "সরানো হয়েছে (@miCRoSCoPiC_eaRthLinG ধন্যবাদ এই উত্তরটি আমাকে এখানে সহায়তা করে) আমার ক্ষেত্রে এটির মডেল দেখানো হয়েছে যাতে আমি তৈরি করেছি (ক্লিক করুন) =" শোয়ারসাল্ট () "
অভ্যন্তরীণ উপাদান.টিগুলিকে জ্যাকুরি ($) এবং ভিতরে বোতামে ক্লিক পদ্ধতি শেরসাল্ট () কল "$ ('# মাইমোডাল') কল করতে হবে mod মোডাল ('শো');"

— ভাগবত ল্যান্ডে
সূত্র

0

আমার একই সমস্যা ছিল কারণ আমি নীচে দেখানো হিসাবে আমার মডেলটি দু'বার টগল করছিলাম:

statusCode: {
    410: function (request, status, error) { //custom error code

        document.getElementById('modalbody').innerHTML = error;
        $('#myErrorModal').modal('toggle')
    }
},
error: function (request, error) {

    document.getElementById('modalbody').innerHTML = error;
    $('#myErrorModal').modal('toggle')
}

আমি এর একটি ঘটনা সরিয়েছি:

$ ( '# MyErrorModal')। মোডাল ( 'টগল')

এবং এটি ম্যাজিক মত কাজ!

— ফলোসো ম্যামস
সূত্র