/ / Require.js и twitter-bootstrap - javascript, twitter-bootstrap, requjs

Require.js и twitter-bootstrap - javascript, twitter-bootstrap, requirejs

Направих изискване.js-scipt да пусне twitter bootstrap в отделен модул. Но когато тествам дали работи, както се предполага, със страница, съдържаща бутон, който ще отвори модален диалог, нищо не се случва. Предполагам, че трябва да направя нещо повече, за да слепя css-компонентите с необходимия модул, но не намирам къде трябва да се променя. Модулът отпечатва съобщението "Заредено .." на конзолата, така че изглежда да работи досега.

Моят модул:

require.config({
paths : {
"jquery" : ["extdep/jquery-1-8-3"],
"bootstrap-modal" : ["extdep/twitter-bootstrap/js/bootstrap-modal"]
},
shim : {
"bootstrap-modal" : ["jquery"]
}
});

require(["jquery", "bootstrap-modal"],
function($){
console.log("Loaded :)");
return {};
}
);

Div, който изпълнява модалния диалогов прозорец и скриптовия маркер към модула.

    <div class="container">
<h2>Example of creating Modals with Twitter Bootstrap</h2>
<div id="example" class="modal hide fade in" style="display: none;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>This is a Modal Heading</h3>
</div>
<div class="modal-body">
<h4>Text in a modal</h4>
<p>You can add some text here.</p>
</div>
<div class="modal-footer">
<a href="#" class="btn btn-success">Call to action</a> <a href="#"
class="btn" data-dismiss="modal">Close</a>
</div>
</div>
<p>
<a data-toggle="modal" href="#example"
class="btn btn-primary btn-large">Launch demo modal</a>
</p>
</div>

<script data-main="main"
src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.4/require.min.js" />

Имате ли някакви идеи за това, което ми липсва?

Отговори:

2 за отговор № 1

Вашата подмяна е грешна. И не трябва ли да имате и шаблон за самия jQuery? Или използвате версия, която е построена да работи с Require.js?

shim : {
"jquery":{
exports: "jQuery"
},
"bootstrap-modal": {
deps: ["jquery"],
exports: "jQuery.fn.modal"
}
}

0 за отговор № 2

аз мисля имате нужда data-parent="example" на този ред.

<a data-toggle="modal" href="#example" class="btn btn-primary btn-large">Launch demo modal</a>

Но аз не съм 100%. Трябва да направите jsfiddle, за да можем да си играем с него.