আমি কি টুইটার বুটস্ট্র্যাপ এবং jQuery UI একই সাথে ব্যবহার করতে পারি?


108

আমি টুইটার বুটস্ট্র্যাপ ব্যবহার করছি এবং আমি একটি "অটো-পরামর্শ" ব্যবহার করতে চাই যা বুটস্ট্র্যাপে উপলভ্য নয়, যেখানে jQuery UI এর অটো-পরামর্শের জন্য নিজস্ব পদ্ধতি রয়েছে।

আমি উভয় ব্যবহার করতে পারি? এটি কি ব্যান্ডউইথকে ওভারলোড করবে?


6
jQuery UI 6.6k (মিনিফায়েড এবং জিজেপড) তাই আপনার ব্যান্ডউইথ কেবিতে মাপা না হলে এটি কোনও সমস্যা হবে না।
ব্রায়ানএইচ

4
আমি এই প্রশ্নটি পোস্ট করার পর থেকে বিষয়গুলি পরিবর্তিত হয়েছে। এখন, প্রচুর বুটস্ট্র্যাপ প্লাগইন রয়েছে যা বিদ্যমান জিকুয়েরি ইউআই প্লাগইনগুলি প্রতিস্থাপনের জন্য যথেষ্ট ভাল। এখন, আমি বুটস্ট্র্যাপের জন্য তৈরি প্লাগইনগুলি সহ বুটস্ট্র্যাপ ব্যবহার করি।
সংকেত সাহু

1
অটো প্রস্তাবের জন্য টুইটারের টাইপহেড ( টুইটার. github.io/typeahead.js/ উদাহরণ ) ব্যবহার করছেন না কেন ?
koppor

উত্তর:


83

পরীক্ষা করে দেখুন jQuery-ui এ-বুটস্ট্র্যাপ । পুনরায় পড়া থেকে:

টুইটারের বুটস্ট্র্যাপটি ২০১১ সালের বাইরে আসার জন্য আমার পছন্দের একটি প্রকল্প ছিল, তবে এটি নিয়মিতভাবে ব্যবহার করা আমার দু'টি জিনিসই চেয়েছিল:

JQuery UI- এর পাশাপাশি পাশাপাশি কাজ করার ক্ষমতা (এমন কিছু যা বেশ কয়েকটি উইজেটকে দৃষ্টিভঙ্গিতে ভেঙে ফেলেছিল) বুটস্ট্র্যাপ স্টাইলগুলি ব্যবহার করে jQuery UI উইজেটগুলি থিম করার ক্ষমতা। আমি jQuery UI পছন্দ করি না কেন, আমি (অন্যদের মতো) সামান্য তারিখ দেখতে বর্তমান থিমগুলির কিছু খুঁজে পাই। আমার আশা এই থিমটি একইরকম অনুভূত অন্যদের জন্য একটি শালীন বিকল্প সরবরাহ করে। পরিষ্কার করার জন্য, এই প্রকল্পটি টুইটার বুটস্ট্র্যাপ প্রতিস্থাপনের লক্ষ্য বা উদ্দেশ্য করে না। এটি কেবল বুটস্ট্র্যাপের ডিজাইনের দ্বারা অনুপ্রাণিত একটি jQuery UI- সামঞ্জস্যপূর্ণ থিম সরবরাহ করে। এটি কয়েকটি (অপ্রাপ্তবয়স্ক) বিভাগের মন্তব্য সহ বুটস্ট্র্যাপ সিএসএসের একটি সংস্করণ সরবরাহ করে যা থিমটিকে পাশাপাশি কাজ করতে সক্ষম করে।


62

কেবল এটি আপডেট করার জন্য, বুটস্ট্র্যাপ v2 আর jquery ui এর সাথে বিরোধ নয়

https://github.com/twbs/bootstrap/issues/171

সম্পাদনা করুন : @ ফ্রেশব্লুড হিসাবে কয়েকটি জিনিস এখনও বিরোধযুক্ত। যাইহোক, মূলত পোস্ট করা টুইটার থেকেই বোঝা যায় যে তারা এটিতে কাজ করছে এবং এটি মূলত কাজ করে, বিশেষত ভি 1 এর সাথে তুলনা করে।


10
আপনি কি সত্যিই এটি সম্পর্কে নিশ্চিত? তবুও আমি jquery ডেটপিকারটি নিয়ে একটি সমস্যা দেখতে পাই
ফ্রেশব্লুড

আমি আপনাকে পরামর্শ দিচ্ছি যে আপনি বুটস্ট্র্যাপ ভি 2 এবং জ্যাকোয়ারি ইউআই নিন এবং এটি আপনার কোড নয় তা যাচাই করার জন্য একটি খালি পরীক্ষার পৃষ্ঠা তৈরি করুন। নতুন সংস্করণ থেকে আমার কোনও সমস্যা হয়নি
ইোনাসদান 12'12

1
দয়া করে এই jquery ui ডেটপিকারটি jqueryui.com/demos/datepicker/#DPdown-month-year দেখুন । আপনি এই সেটিংসের সাথে দেখতে পাচ্ছেন ডেটপিকারে ড্রপডাউনবক্স উপাদান রয়েছে তাই বুটস্ট্র্যাপ ইতিমধ্যে সমস্ত ইনপুট উপাদানকে ওভাররাইড করে। তবে আপনি যদি এই সেটিংসের সাথে ডেটপিকার ব্যবহার না করেন তবে কোনও সমস্যা নেই।
ফ্রেশব্লুড

1
যে কোনও উইজেটে ইনপুট উপাদান রয়েছে টুইটার বুটস্ট্র্যাপ সিএসএস শৈলীর সাথে বিরোধ করবে will
ফ্রেশব্লুড 12'12

1
অস্বীকৃতিপূর্ণ। বুটস্ট্র্যাপের বোতাম ফাংশনগুলি jQuery UI এর সাথে কাজ করে না কারণ তারা উভয়ই একটি button()পদ্ধতির সংজ্ঞা দেয় ।
ব্রায়ানএইচ

24

ভবিষ্যতের রেফারেন্সের জন্য (যেহেতু এটি গুগলের শীর্ষ উত্তর এটিএম), jQuery UI কে বুটস্ট্র্যাপ বা আপনার কাস্টম স্টাইলকে ওভাররাইড করা থেকে বিরত রাখতে আপনাকে একটি কাস্টম ডাউনলোড তৈরি করতে হবে এবং no-themeথিমটি নির্বাচন করতে হবে । এর মধ্যে কেবল jQuery UI এর পুনরায় সেটগুলি অন্তর্ভুক্ত থাকবে এবং বিভিন্ন উপাদানগুলির জন্য ওভারলোড বুটস্ট্র্যাপের স্টাইলটি থাকবে না।

যখন আমরা এটিতে থাকি তখন কিছু jQuery UI উপাদান (যেমন ডেটপিকার) এর একটি নেটিভ বুটস্ট্র্যাপ বাস্তবায়ন থাকে। নেটিভ বুটস্ট্র্যাপ বাস্তবায়নগুলি বুটস্ট্র্যাপ CSS ক্লাস, বৈশিষ্ট্য এবং লেআউট ব্যবহার করবে, সুতরাং বাকী ফ্রেমওয়ার্কের সাথে আরও ভাল সংহতকরণ হওয়া উচিত।


আমি এখানে কোনও নো-থিম দেখছি না: jqueryui.com/themeroller । আমি কি এটি মিস করেছি বা এটি আর নেই?
গাফান

3
আপনার ব্যবহার করা উচিত সেই লিঙ্কটি jqueryui.com/download । নীচে স্ক্রোল করুন এবং তালিকায় "থিম নেই" নির্বাচন করুন।
T0xicCode

3

আমার সীমিত অভিজ্ঞতায় আমি সমস্যাগুলিও নিয়ে আসছি। এটি প্রদর্শিত হয় যে JQuery উপাদানগুলি (যেমন বোতামগুলি) বুটস্ট্র্যাপ সিএসএস ব্যবহার করে স্টাইল করা যেতে পারে। তবে, আমি একটি জিকুয়েরি ইউআই ট্যাব তৈরি করে এবং প্রতিটি ট্যাবের নীচে বুটস্ট্র্যাপ কেবল ইনপুট (ইনপুট-অ্যাপেন্ড শ্রেণি ব্যবহার করে) লক করতে চাইছি এমন সমস্যাগুলির মুখোমুখি হচ্ছি, কেবল প্রথমটি সঠিকভাবে বসে। সুতরাং, জিকিউরি ট্যাব + বুটস্ট্র্যাপ বোতামগুলি = সম্ভবত নেই not


2

বুটস্ট্র্যাপটি এখনও জ্যাকুই ইউআইয়ের সাথে কাজ করে না, উদাহরণস্বরূপ মডেল B বুটস্ট্র্যাপের দুর্দান্ত স্টাইল রয়েছে তবে টুইটারের পিছনে একটি কাঠামো হিসাবে এটি ভাল নয়।


2

আপনি যদি জাভাস্ক্রিপ্ট নেমস্পেসের সংঘর্ষগুলির মধ্যে চলেছেন তবে আপনি বুটস্ট্র্যাপের noConflict()ফাংশনটি এটি jQuery UI- র কার্যকারিতাটিকে সিড করে তুলতে পারেন।


2

যদিও এই প্রশ্নটিতে jQuery-UI অটোসোজেস্ট বৈশিষ্ট্যটি উল্লেখ করা হয়েছে, তবে প্রশ্নের শিরোনামটি আরও সাধারণ: বুটস্ট্র্যাপ 3 jQuery UI এর সাথে কাজ করে? জ্যাকিউআইআই ডেটপিকার (পপ-আপ ক্যালেন্ডার) বৈশিষ্ট্যটি নিয়ে আমার সমস্যা হচ্ছে। আমি ডেটপিকারের সমস্যার সমাধান করেছি এবং আশা করি সমাধানটি অন্যান্য জেকিউআই / বিএস সমস্যাগুলির সাথে সহায়তা করবে।

বুটস্ট্র্যাপ ৩.৩..7 নিয়ে কাজ করার জন্য সর্বশেষতম jQueryUI (ভার্স 1.12.1) ডেটপিকারটি পেতে আজ আমার একটি কঠিন সময় হয়েছিল। যা ঘটছিল তা হ'ল ক্যালেন্ডারটি প্রদর্শিত হবে তবে এটি বন্ধ হবে না।

জেকিউআই এবং বিএস-এর সংস্করণ সমস্যা হিসাবে দেখা গেছে। আমি বুটস্ট্র্যাপের সর্বশেষতম সংস্করণটি ব্যবহার করছিলাম এবং দেখতে পেলাম যে আমাকে জেকিউআই এবং জিকুয়েরির এই সংস্করণগুলিতে ডাউনগ্রেড করতে হয়েছিল:

jQueryUI - 1.9.2 (পরীক্ষিত - কাজ)
jQuery - 1.9.1 বা 2.1.4 (পরীক্ষিত - উভয় কাজ।
অন্যভাবে কাজ করতে পারে তবে এই কাজগুলি।) বুটস্ট্র্যাপ 3.3.7 (পরীক্ষিত - কাজ)

যেহেতু আমি একটি কাস্টম থিম ব্যবহার করতে চেয়েছিলাম, তাই আমি জেএকিউআইয়ের একটি কাস্টম ডাউনলোডও তৈরি করেছি (সমস্ত ইন্টারঅ্যাকশন, ডায়ালগ, প্রগতিবার এবং আমি ব্যবহার করি না এমন কয়েকটি প্রভাবের মতো কয়েকটি জিনিস মুছে ফেলেছে) - এবং "কাপার্টিনো" নির্বাচন করার বিষয়টি নিশ্চিত করেছিলাম আমার থিম হিসাবে নীচে।

আমি তাদের এগুলি ইনস্টল করেছি:

<head>
...etc...
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/cupertino/jquery-ui-1.9.2.custom.min.css">
<link rel="stylesheet" href="css/bootstrap-3.3.7.min.css">

<!-- <script src="js/jquery-1.9.1.min.js"></script> -->
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="js/bootstrap-3.3.7.min.js"></script>
...etc...
</head>

আগ্রহীদের জন্য, সিএসএস ফোল্ডারটি দেখতে এমন দেখাচ্ছে:

[css]
  - bootstrap-3.3.7.min.css
  - font-awesome.min.css
  - style.css
  - [cupertino]
      - jquery-ui-1.9.2.custom.min.css
      [images]
          - ui-bg_diagonals-thick_90_eeeeee_40x40.png
          - ui-bg_glass_100_e4f1fb_1x400.png
          - ui-bg_glass_50_3baae3_1x400.png
          - ui-bg_glass_80_d7ebf9_1x400.png
          - ui-bg_highlight-hard_100_f2f5f7_1x100.png
          - etc (8 more files that were in the downloaded jQUI zip file)

1

যদি এটি স্থানীয়ভাবে সংরক্ষণ না করে এবং তারা সরবরাহ করে এমন লিঙ্কটি ব্যবহার করে তবে আপনার উন্নত পারফরম্যান্স হতে পারে client ক্লায়েন্টটির স্ক্রিপ্টগুলি ইতিমধ্যে কিছু ক্ষেত্রে ক্যাশে থাকতে পারে। JQueryUI এর ক্ষেত্রে আমি প্রয়োজন পর্যন্ত এটি লোড না করার পরামর্শ দেব। এগুলি উভয়ই হ্রাস করা হয়েছে, তবে আপনি কনসোলটি জ্বালিয়ে দেখতে পারেন এবং নেটওয়ার্ক ট্যাবটি দেখতে পারেন এবং এটি লোড হতে কতক্ষণ সময় নেয় তা একবার শুরুতে ডাউনলোড করার পরে এটি ক্যাশে হবে যাতে আপনার পরে চিন্তা করা উচিত নয় M আমার উপসংহারটি হবে would হ্যাঁ এই দুটি ব্যবহার করুন তবে একটি সিডিএন ব্যবহার করুন


1

হ্যাঁ আপনি উভয় ব্যবহার করতে পারেন। টুইটারের জেএস বুটস্ট্র্যাপ হ'ল জ্যাকুরি প্লাগইনগুলির সংকলন। JQuery UI এর সাথে কোনও বিরোধ নেই।

ব্যান্ডউইথ ওভারলোড সম্পর্কে, এটি আপনার সমস্ত জেএস ফাইল লোড করার অনুরোধগুলি কীভাবে পরিচালনা করবেন তার উপর নির্ভর করে। আপনি যদি প্রতিটি ফাইলের জন্য অনুরোধ করার জন্য সার্ভারের কাছে একাধিক অনুরোধ করতে চান না, কেবল তাদের একসাথে যুক্ত করুন এবং ছোট করুন। অথবা আপনি সম্ভবত কিছু জেএস বুটস্ট্র্যাপ প্লাগইনগুলি থেকে মুক্তি পেতে পারেন। এটি খুব মডুলার।


4
সমস্ত জেএস যথাযথভাবে নাম-গতিযুক্ত, তবে এটি আপনার সিএসএসের সংঘর্ষের বিষয় যা আপনার চিন্তা করা উচিত: আপনি যদি বুটস্ট্র্যাপ ট্যাবে কোনও জেআইআই উইজেট অন্তর্ভুক্ত করেন তবে অগ্রাধিকারটি কী লাগে?
বিটাউন

এটি কেবল jQuery এর সিএসএস নয় যা বুটস্ট্র্যাপে খারাপ দেখাচ্ছে। বুটস্ট্র্যাপগুলি বেশিরভাগ ক্ষেত্রেই সিএসএস পরিবর্তনগুলি পরিষ্কার করে তোলে !importantযা আমি নিজেকে ক্রমাগত ওভাররাইড এবং ফিক্স করতে দেখি, কখনও কখনও হ্যাকি কোড সহ। আমি বুটস্ট্র্যাপকে ঘৃণা করি এবং এর ব্যবহারকে নিরুৎসাহিত করি, যতক্ষণ না এটি বুটস্ট্র্যাপের ক্লাস ব্যবহার না করে এমন উপাদানগুলির সাথে কৌটা বন্ধ না করে। (এটি আসল ডিজাইনারের দোষ নয় Twitter আমি সন্দেহ করি যে টুইটারের মূল ডেভসরা তারা একটি জনপ্রিয় লাইব্রেরি হওয়ার জন্য কী কাজ করছে বলে আশা করেছিল।)
মাইকেল শেপার

1

কেন্দো ইউআইয়ের এখানে একটি দুর্দান্ত বুটস্ট্র্যাপ থিম রয়েছে এবং jquery-UI এর সাথে তুলনীয় ওয়েব ইউআইয়ের একটি সেট রয়েছে। তাদের একটি ওপেন সোর্স সংস্করণও রয়েছে যা থিমের সাথে দুর্দান্তভাবে কাজ করে।


0

আমি jquery ui ব্যবহার করে সাইটটি বিকাশ করেছি, আমি কেবল ভবিষ্যতের বিকাশ এবং স্টাইলিংয়ের জন্য বুটস্ট্র্যাপে প্লাগ ইন করার চেষ্টা করেছি তবে এটি কার্যত সবকিছু ভেঙে দেয়।

সুতরাং না তারা সামঞ্জস্যপূর্ণ নয়।


0

কারণ jquery ui এবং বুটস্ট্র্যাপ.জেজে গুগলে এটি শীর্ষ ফলাফল result আমি এটি সম্প্রদায় উইকি হিসাবে যুক্ত করার সিদ্ধান্ত নিয়েছি।

আমি ব্যাবহার করছি:

  • বুটস্ট্র্যাপ v3.2.0
  • jQuery-2.1.0
  • jQuery-ui এ-1.10.3

এবং কোনও উপায়ে আমি বুটস্ট্র্যাপ.জেএস অন্তর্ভুক্ত করলে এটি jquery ui স্বয়ংক্রিয়রূপের ড্রপডাউনটি অক্ষম করে ।

আমার তিনটি কাজ

  • bootstrap.js বাদ দিন
  • বা আরও অনেক কিছু টাইপ করতে হবে
  • bootstrap.js থেকে bootstrap.min.js এ যান (অদ্ভুত, তবে আমার জন্য কাজ করেছেন)

জকিউরি ইউআই বুটস্ট্র্যাপের সংমিশ্রণটি টুলটিপ এবং ডেটপিকারকেও অক্ষম করে।
বিপুল হাডিয়া

-3

ডেটা-রোল = "কিছুই নয়" তাদের একসাথে কাজ করার মূল চাবিকাঠি। আপনি যে উপাদানগুলিতে বুটস্ট্র্যাপটি স্পর্শ করতে চান সেগুলি প্রয়োগ করতে পারেন তবে jquery মোবাইল উপেক্ষা করতে পারেন। এই ইনপুট প্রকারের মতো = "পাঠ্য" শ্রেণি = "ফর্ম-নিয়ন্ত্রণ" স্থানধারক = "অনুসন্ধান" ডেটা-ভূমিকা = "কিছুই নয়"


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