天道酬勤,学无止境

twitter-bootstrap

Bootstrap + Flexslider: Loading Flexslider within hidden element causes jQuery to be unresponsive

I have a login page which loads just fine when above 767px wide and crashes the browser below that width. It only crashes when loading below that width, I can load at desktop width then size down just fine. I have one div with .visible-desktop that contains the desktop login and superfluous stuff and another with .hidden-desktop containing only the mobile login. An image in the superfluous stuff is currently 404'ing. I'll fix it but it sure shouldn't be crashing the browser. In the server console, the asset previous to the 404 asset loads and nothing else happens. In the browser, the page

2021-10-26 04:36:08    分类:问答    ruby-on-rails-3   twitter-bootstrap

Add function to the plugin js without actually modifying js file

I want to add 'setInputDataId' function at same level as the existing function '_select' is, in plugin js http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js file without actually modifying the file itself. So I would like to know how can I add new function, I would appreciate the help. Existing Code in Plugin: _select: function select(datum) { this.input.setQuery(datum.value); this.input.setInputValue(datum.value, true); this._setLanguageDirection(); this.eventBus.trigger("selected", datum.raw, datum.datasetName); this.dropdown.close(); _.defer(_.bind(this.dropdown.empty

2021-10-26 03:26:23    分类:问答    javascript   jquery   twitter-bootstrap   jquery-plugins   twitter-bootstrap-3

Bootstrap JQuery loading state auto disables button, how to get other states to do the same

$this.button('loading') auto adds disabled class to it while it's running, I want to create a second version of $this.button('loading'). So I can have 2 versions of text in a loading button. If I use a custom entry such as continue or loading2, it applies the text but does not apply the disabled class during that timeframe Example http://www.bootply.com/129005# I've tried just doing an attr add and changing the html of the button, which works. But the form actually won't ever complete, it just hangs on the second text. The second portion of text needs to stay until the php page it calls gets

2021-10-26 02:53:29    分类:问答    javascript   php   jquery   ajax   twitter-bootstrap

使用引导程序以 django 模型形式显示自定义错误消息(Showing custom error messages in django model form with bootstrap)

问题 如果某些字段无效,我想显示自定义错误消息。 我有以下型号: class Test(models.Model): name = models.IntegerField(max_length=10) class TestForm(forms.ModelForm): class Meta: model = Test fields = '__all__' error_messages = { 'name': { 'max_length': ("This user's name is too long."), }, } 观点是: def test(request): if request.method == 'POST': print "The form is submitted successfully." form = TestForm(request.POST) if form.is_valid(): print request.POST.get("name") return render(request, 'test.html',{'form' : TestForm()}) else: print "Something wrong with inputs." return render(request, 'test.html',{'form' : form}) else

2021-10-26 00:10:55    分类:技术分享    django   twitter-bootstrap

Set twitter bootstrap popover to hide after a certain event then show after another event

A user makes a change in a textarea. When this change occurs and another condition is true (in this particular case, the condition is that a text field contains "yes"), I show a bootstrap popover. showPopover = function() { return $(this).popover("show"); }; hidePopover = function() { return $(this).popover("hide"); }; var cond = true; $("textarea").on("change keyup", function (e) { var pt = $("#user_user_profile_attributes_title").val(); if (cond&&pt=="yes") { $("[rel=next-popover]").popover({ placement: "right", trigger: "manual" }) .hover(showPopover, hidePopover).click(showPopover); } else

2021-10-25 22:56:30    分类:问答    javascript   jquery   twitter-bootstrap

Bootstrap Switch 不会在角度指令中触发 SetState 事件(Bootstrap Switch not firing SetState event in angular directive)

问题 我正在使用 Wrapbootstrap 模板。 并使用其路由和 ng-view 类型的东西将其转换为单页应用程序。 这个第三方模板似乎正在使用引导程序开关。 但它没有引用 bootstrap-switch.js,而是有一个叫做 toggler.js 的东西,它把带有 'make-switch' 类的元素转换成一个开关。 问题 1:供应商是否对 Bootstrap Switch v2.0 进行了调整以制作此 JS? toggler.js 的代码 ! function(e) { "use strict"; e.fn.bootstrapSwitch = function(t) { var i = 'input[type!="hidden"]', n = { init: function() { return this.each(function() { var t, n, a, s, o, r, l = e(this), c = l.closest("form"), u = "", d = l.attr("class"), h = "ON", p = "OFF", f = !1, m = !1; e.each(["switch-mini", "switch-small", "switch-large"], function(e, t) { d.indexOf(t) >= 0 &&

2021-10-25 22:29:03    分类:技术分享    twitter-bootstrap   angularjs-directive   single-page-application   bootstrap-switch

angularjs bootstrap 的预输入的 RTL(RTL for angularjs bootstrap's typeahead)

问题 如下所示,当我希望它在右侧时, completion list在左侧。 我怎样才能做到这一点? 这是我的作品 回答1 你必须在你的样式文件中覆盖引导程序的.dropdown-menu类,如下所示: .dropdown-menu{ float:right !important; position:inherit !important; } 演示

2021-10-25 22:15:13    分类:技术分享    javascript   angularjs   twitter-bootstrap   angular-ui-bootstrap   bootstrap-typeahead

选择选项不能单独工作(select option doesn't work separately)

问题 在给定的小提琴链接中,当我单击电子邮件或电话部分中的绿色加号按钮时,它会创建一个新的输入字段。当我想从下拉菜单中选择一个选项时,它还会在所有下拉菜单中选择选项。 *需要单独工作下拉菜单。 *点击下拉菜单文本时需要选择单选按钮。 这是 JSFIDDLE 链接 回答1 您对电话和电子邮件使用相同的 ID,即“search_concept”使用不同的 ID 并相应地更改代码。 回答2 你必须在 ul 旁边使用按钮标签才能工作,但我认为这就是你想要的! $(document).on("click", 'a.radio_click', function(){ var param = $(this).attr("href").replace("#",""); var concept = $(this).text(); var span = $(this).closest("ul").prev().find("span#search_concept"); span.text(concept); $(this).find('input').prop('checked', true); $('.input-group #search_param').val(param); }); 你必须删除 $('.search-panel .dropdown-menu').find('a').click

2021-10-25 21:23:49    分类:技术分享    jquery   twitter-bootstrap   select   input

从 grails 控制器调用 Bootstrap 弹出窗口(Calling a Bootstrap popup from grails controller)

问题 我需要显示错误消息弹出窗口,如下面的链接所示。 它应该出现在页面顶部几秒钟,然后消失。 if (!userInstance.save(flush: true)) { // THE ERROR POPUP SHOULD BE CALLED FROM HERE return }else { ... } 我应该把代码放在我的 HTML 的什么地方,我应该如何从 GRAILS 控制器调用它? 回答1 与显示来自控制器的数据的任何视图一样,您应该将此信息放入模型中。 我建议您在模型中选择一个标准元素,以使其更容易在整个项目中实现(我认为这就是您的目标)。 例如,在您的控制器中: def model = [:] model['userInstance'] = userInstance ... if (!userInstance.save(flush: true)) { // set/lookup the error message model['errorMessage'] = message(code: 'some.error.message.you.lookup') // render the view render(view: 'theviewname', model: model) return }else { ... } 然后你可以在你的视图(或布局)中显示它: <g:if

2021-10-25 21:02:02    分类:技术分享    twitter-bootstrap   grails

Fix Position of images at Left, center and right on page but also responsive

If I want one image on left hand side and another one is on right hand side simultaneously in same row such that it is responsive in every device. Then what should I do? As you can see in given image example of iphone and headphone images. I trying to achieve like this. Problem is that this is responsive So individual images like iphone, logo , headphone stack below each other in smaller screen. HTML: <div class="jumbotron" style="background-image: url('background.png'); width: 100%; height: 100%;position: absolute; top: 0; left: 0; overflow: hidden; background-size: cover; background-repeat

2021-10-25 20:46:10    分类:问答    html   css   twitter-bootstrap