Bootstrap

AngularJs

Telerik

Custom Bootstrap 5 Breadcrumbs

1 Feb 2024 by Mark Pelf

Custom Breadcrumbs (CSS) for Bootstrap 5 framework

A Natural Language Processing Engine (NLP) for Chatbots In Node.js, JavaScript/jQuery, HTML5, CSS, MDBootstrap4, Angular2 and MySQL

30 Jan 2024 by Arthur V. Ratz

Create and deploy a rule-based NLP engine

How to load and toggle bootstrap.rtl.css file inside react app

24 Dec 2023 by Member 12214576

I'm trying to implement a multi-language React JS website I have implemented the translation files and language buttons and the translation is working but what I need is to change the layout of the pages I'm using Bootstrap v5.3 on my project, I...

ReactJS

How to display a modal form in blazor when button is clicked?

21 Nov 2023 by Gcobani Mkontwana

Hi Team I have a modal form with fields from the model and my razor component needs when a user clicks a button to open this modal form. Currently when debug from the console to see if there are any errors and no errors from the css nor...

Blazor

BlazorForms

Disable saturday and sunday in datepicker

10 Oct 2023 by pratik_panchal

Hi You can also use this way j("#startTime").datepicker({ beforeShowDay: $.datepicker.noWeekends }); j("#endTime").datepicker({ beforeShowDay: $.datepicker.noWeekends });

Billing form is not validating correctly

7 Oct 2023 by Andre Oosthuizen

The problem lies in your 'validateAndUpdateField' function that does not check wheteher all fields have been filled or not, change it to - $(document).ready(function() { // ... Existing code ... // Event listener for the "Proceed To...

Billing form is not validating correctly

5 Oct 2023 by Gcobani Mkontwana

I have a billing form, but the issue is that it is not validating correctly. I want that when user clicks proceed payment, it must ensure that all fields are inserted, thereafter they can proceed to the next page. What I have tried:

Creating Reusable Component with Angular

25 Sep 2023 by Han Bo Sun

In this tutorial, I will discuss how to create a reusable component in an Angular application.

Typescript

Bootstrap alert message using PHP and HTML

16 Aug 2023 by Andre Oosthuizen

I am not sure what you mean by "raw" message? I tried your code and it worked fine, I added a style of 'grey' background and it still displays fine. I ran the code on the W3Schools Editor - Editor[^] which uses bootstrap as default and it...

Bootstrap alert message using PHP and HTML

16 Aug 2023 by Gcobani Mkontwana

I am creating some alert message, somehow, it does not seem like I am doing this the right way and need some assistance. This issue is that it is displaying message as raw data from back end, not style alert as expected. What I have tried: ...

Integrating File Upload in an Angular Application

15 Aug 2023 by Han Bo Sun

In this tutorial, I will discuss how to add file upload functionality to an Angular web application.

Issue with my bootstrap meta tag that failing entire site

13 Aug 2023 by pedro_188

Hello to you all the programmers. I have question please help ,I appreciate it . I built a website by bootstrap and HTML and CSS . but the fact is that I had these tags inserted for supporting of Visual Studio code for my web page.

Issue with my bootstrap meta tag that failing entire site

12 Aug 2023 by Graeme_Grant

Yep, v3.4.1 and v5.3.1 are very different! There are breaking changes. Here is the v3.4 documentation: Bootstrap v3.4[^] and here is v5.3 documentation: Bootstrap v5.3[^] You will need to update your project if you want to use the latest version.

Uncaught reference errror: onclick proceedtobilling() function?

2 Aug 2023 by Dave Kreskowiak

No, you haven't "tried that". You think you did, but looking over all the questions you've posted, I don't think you have. It's as easy as moving a line in your code: // Update cart load. $(document).ready(function () { var...

Uncaught reference errror: onclick proceedtobilling() function?

2 Aug 2023 by Gcobani Mkontwana

Hi team I have been debugging this problem almost 1 hour. I need some help, i have an onclick event handler when click to redirect user to billing_address and have used correct js libraries to handle this. Somehow when i use correct name...

Uncaught reference errror: onclick proceedtobilling() function?

2 Aug 2023 by Richard Deeming

RMC is correct; any function referenced by an on... attribute within the HTML needs to be a global function, not a function nested within another function. You need to move the function outside of the jQuery event handler: $(function(){ var...

How to fit two selects side by side in a form with react-bootstrap

26 Jul 2023 by Laure CHAPERT

I'm learning react-bootstrap but I've found a pb . In fact, I'm making a responsive website and I want two designs with my form (for the sm screen and for the lg screen). I have a form with two selects . In sm mode, I want them to be one above...

React

How to fit two selects side by side in a form with react-bootstrap

26 Jul 2023 by Member 16059077

import './searchBar.scss'; import { Form, Button, } from 'react-bootstrap'; const AppHeader = () => (

React

25 Jul 2023 by Member 11400059

Hi I trying Create Website with asp.net (asp.net core mvc). I need Create simple text editor. then save too the database. I couldn't find a proper tutorial for this. Either it was too simple and didn't have the facilities I wanted, or it was too...

25 Jul 2023 by Gulshan Negi

Well, there are lots of resource which can help you to develop editor using CSS / HTMl and JS. Here is the code reference. Simple Text Editor body { font-family:...

24 Jul 2023 by Richard MacCutchan

Google finds lots of possibilities: html text editor - Google Search[^]

23 Jul 2023 by OriginalGriff

While we are more than willing to help those that are stuck, that doesn't mean that we are here to do it all for you! We can't do all the work, you are either getting paid for this, or it's part of your grades and it wouldn't be at all fair for...

16 Jul 2023 by Graeme_Grant

Looking at it slightly differently to Richard... Bootstrap adds unnecessary overhead and slows down the loading of your website. I find the best solution is to dump frameworks like Bootstrap as you have to bend to their will and make...

16 Jul 2023 by Member 11400059

Hi I create header with bootstrap 5.3. I want different order in small and another size of screen. for this I use "order-sm-*", but the element change in another size with this. how to fix this problem? What I have tried: also my body is rtl. I...

16 Jul 2023 by Richard Deeming

Bootstrap's responsive classes apply to the specified screen resolution or greater: Breakpoints · Bootstrap v5.3[^] order-sm-* will apply on any screen whose width is greater than or equal to 576px. If you want to specify a different order for...

15 Jul 2023 by Andre Oosthuizen

You are looking to use Media Query properties for alignment of elements based on screen sizes. Tutorial on the properties with sample code is at - Responsive Web Design - Media Queries [^]

How can change location of button slideshow in bootstrap 5?

10 Jul 2023 by Member 11400059

Hi I want Create Slideshow with bootstrap 5. Also I want the indictors, next and previous button show center and under the slideshow. just like the "microsoft.com" slideshow. how to do this? please help. What I have tried: my slide show code...

How can change location of button slideshow in bootstrap 5?

10 Jul 2023 by Andre Oosthuizen

The 'slideshow' is called a carousel. There are tons of examples if you search for Bootstrap 5 Carousel - Google bootstrap 5 carousel[^] The first one that popped up gives you multiple uses and sample code - Carousel - With controls[^] is the...

How to make edit_order page work

15 Jun 2023 by Ingūna Preize

Hello. I have encountered a situation when the code is correct, but there are problems showing 'edit_order.php' which is in the admin panel.' here is what I see now Order Id Notice: Trying to access array offset on value of type null in...

Reducing the size of a shopping cart

12 Jun 2023 by Andre Oosthuizen

You can utilize the grid system and create a container with rows and columns in bootstrap - Your html is incorrect by using php variables not contained within php tags.Your html will look like this - ...

Reducing the size of a shopping cart

12 Jun 2023 by Gcobani Mkontwana

Hi Team I Want to reduce size of my div card, they dont appear good. want them display 4 by 4 each row. How do i achieve this using bootstrap div card? What I have tried: // Display the products $stmt = $pdo->query("SELECT * FROM products");...

Reducing the size of a shopping cart

12 Jun 2023 by Richard Deeming

You haven't told us which version of Bootstrap. But whichever version you're using, the answer is almost certainly in the documentation. Bootstrap 5: Grid system · Bootstrap v5.3[^] Bootstrap 4: Grid system · Bootstrap v4.6[^] If you still...

Wrapping div container is not displaying

22 May 2023 by Gcobani Mkontwana

Hi Team I am using css to wrap the div container on my credit card form, its not showing and there are no error, yet i have refreshed the browser. What exactly am i missing to achieve this? What I have tried:

Wrapping div container is not displaying

22 May 2023 by Andre Oosthuizen

As per Karthik_Mahalingam, All of your elements is enclosed inside this div - The style is set to not display hence the fact that you see nothing whilst the code is running fine as expected...

Bootstrap submenu doesn't work well on mobile

22 May 2023 by FRS4002

I have a navbar with this code: ...

Bootstrap submenu doesn't work well on mobile

22 May 2023 by Andre Oosthuizen

From your css file, a few changes that is needed, I did not test but this should work - /* For screen sizes up to 768px */ .dropdown:hover > .dropdown-menu, .dropend:hover > .dropdown-menu { position: block; margin-top: .125em; ...

Bootstrap modal form validation not working with select2

13 May 2023 by anil_kumar_bhakta

I am using bootstrap modal form calling a partialview from Index.cshtml. It's work fine until I use Select2. The same partialview working fine without Select2. The same Select2 also working fine with the same partialview. But problem is that...

Bootstrap modal form validation not working with select2

13 May 2023 by Member 16003324

This code you can used in MultiModal form in one page . //On load content if ($('.select').length > 0) { $(".select").select2({ minimumResultsForSearch: -1, width: '100%' }); } //Fix...

Making cart popup size as same with cart popup

8 May 2023 by Gcobani Mkontwana

Hi Team I have a cart popup, the size is normal but the problem when click view-detail is not the same as normal cart popup, How do i apply changes to look the same? What I have tried:

Uncaught typeerror: $(...).registermessage is not a function

3 May 2023 by Gcobani Mkontwana

Hi Team I am getting this error on my register js file, how do i resolve it and have included the jquery plugin library for it. What I have tried: /** *@author:Gcobani Mkontwana *@date:03/05/2023 *@Register users to the form and validate...

Uncaught typeerror: $(...).registermessage is not a function

3 May 2023 by Richard Deeming

Your register-messages.js script is invalid. You define a function to define the registerMessage extension, but you never call it. (function($) { $.fn.registerMessage = function(message, type) { ... }; }) Add (jQuery); to the end of...

Select dropdownlist when clicked it hides

27 Apr 2023 by Gcobani Mkontwana

Hi Team I have dropdownlist and now the problem i dont want it to hide when a user finish selecting subcategories it must still be open and close. Still select from category and subcategory. What I have tried: ...

Select dropdownlist when clicked it hides

27 Apr 2023 by Rebecca2002

not sure what do want but do you mean something like this?? Action Another action Something else...

Streching a table to the right not left

26 Apr 2023 by Gcobani Mkontwana

Hi Team My table for order summary is not stretching from the right instead there is an empty space. How do i achieve this in bootstrap? What I have tried:

Streching a table to the right not left

26 Apr 2023 by Richard Deeming

You have two tables in that HTML. One is wrapped in a col-lg-9 container; the other is wrapped in a col-lg-3 container. As soon as your screen reaches 992px wide, the col-lg-9 container will be limited to 75% of its parent's width; the col-lg-3...

Select dropdownlist with sub-categories to each dropdownlist

25 Apr 2023 by Gcobani Mkontwana

Hi Team I am experience small issue with my code, i need to find a way where i will have category of its own with subcategory. I am using javascript together with bootstrap class to do. Maybe if i can be shown 5 of these, rest i can follow them...

Can someone help me with my code

25 Apr 2023 by Dave Kreskowiak

Define what you mean by "help" in this context. There are two possible contexts here. You either want someone to teach you everything you need to know to write the code, which isn't going to happen because you haven't said a single word about...

Cart is empty but the basket has item added

24 Apr 2023 by Gcobani Mkontwana

Hi Team I need some help with my basket its adding the item, but on the basket.php shopping cart is empty. What I have tried:

Alignment of div cards using CSS

14 Apr 2023 by Gcobani Mkontwana

Hi Team I have 3 div cards they all seem to overlap to each other, how do i keep them aligned to each other? They must be in the same direction e.g 1, 2, 3 sequential to say. What I have tried: // Price Drop is a good example its not...

Alignment of div cards using CSS

14 Apr 2023 by Graeme_Grant

You have posted no CSS for us to work with, so let me show you examples of cards and how others have done, with code and live examples, what you are asking: Cards | CodePen[^]

Spaces for div class using CSS and bootstrap

11 Apr 2023 by Gcobani Mkontwana

Hi Team I cant seem to have or create spaces for my div classes, want to create a spaces between them. They currently tightly close to one another and they dont seem to look good for UI design. What I have tried: // Bootstrap div class

Spaces for div class using CSS and bootstrap

11 Apr 2023 by Gcobani Mkontwana

Hi Team I only applied the following logic to be able to achieve this without any issues. picture { display: block; max-width: 100%; height: auto; margin-bottom: 20px; /* add margin to create space between pictures */ } @media...

Spaces for div class using CSS and bootstrap

10 Apr 2023 by Mike Hankey

The bootstrap grid system is -pretty flexible see if this helps; Grid system · Bootstrap[^]

Background color is grey but not white using CSS?

5 Apr 2023 by Gcobani Mkontwana

Hi Team I have two files on my css and im using them for style the pages of the website the issue i cant find the color grey, changed the background color to be white. What am i missing from these two files to find this property? What I have...

Progress bar status with check using CSS and bootstrap

5 Apr 2023 by Gcobani Mkontwana

Hi Team I have progress bar, the issue is on check bar status it does not look good. I want my progress bar be light grey and check bar should be green from step1-step4 in between the color should be grey and be moved straight horizontal. What...

How to call bootstrap modalpopup in usercontrol ?

4 Apr 2023 by ch12

How to call bootstrap modalpopup in usercontrol ? (or) How to cal bootstrap modal popup in .aspx page not masterpage in asp.net. What I have tried: How to call bootstrap modalpopup in usercontrol ?

ASP.NET

Nav-bar tab when click display div card with image inside using bootstrap

31 Mar 2023 by Gcobani Mkontwana

Hi Team I need some help with my nav-bar tab, i want when a tab is clicked it should display a div card next to it from the right hand side. So i got only 3 nav bar tabs want them to do the same each time when clicked there should be a display...

Div cards move side to side spaces in between using bootstrap

30 Mar 2023 by Gcobani Mkontwana

Hi Team I have div cards and i am using d-flex adjustment..... But they do not appear to be moving from left to right,that is side by side with spaces in between. Their position is all over the place with no good ui. Need some help with this...

Div cards move side to side spaces in between using bootstrap

30 Mar 2023 by Richard Deeming

Your HTML is an absolute mess: Edit fiddle - JSFiddle - Code Playground[^] You have cards-container elements within other cards-container elements; and you have cards-container elements containing single card-container elements. You haven't...

Dashboard layout not looking good using bootstrap

25 Mar 2023 by Gcobani Mkontwana

Hi Team My dashboard is not looking good, need some help with this layout so can look exactly like normal dashboard when doing ecommerce. Layout is not good at all. The problem is not back end, need very good UI for my dashboard including navbar...

How to inline your buttons from the form?

16 Mar 2023 by Gcobani Mkontwana

Hi team I need help with my two buttons they are not inline and causing to themselves to be pushed further away. try to use external css but now cant sign using signaturepad. But i need to rather bring them closer to signaturepad, space in...

What wrong with ASP.NET MVC layout

14 Mar 2023 by Member 12241961

You can check for bootstrap version. If you have updated it recently. There're a lot of changes in Bootstrap 4 in comparison to older versions.

Validating form before submit is not showing any validation error from the form

4 Mar 2023 by Gcobani Mkontwana

Hi Team I have a problem with my jquery form, i am using jquery validation plugin and all libraries are imported from the form right. But now the form before a user insert data its not validation before submit and when inspect the element its...

Validating form before submit is not showing any validation error from the form

4 Mar 2023 by Gcobani Mkontwana

Hi Team I have managed to do the following after debugging the steps back, i forgot to put the document before the function because i am using jquery validator plugin not javascript itself. DOM element by rule does not support that rule. /** ...

Signup during registration is not registering users to the database record?

26 Feb 2023 by Gcobani Mkontwana

Hi Team I have back end written in php and its registers users that are new to the database and database name and config are correct. The problem each time i try to register new users to the db record list it throws an exception that i have...

Signup during registration is not registering users to the database record?

26 Feb 2023 by OriginalGriff

Don't do it like that! Never concatenate strings to build a SQL command. It leaves you wide open to accidental or deliberate SQL Injection attack which can destroy your entire database. Always use Parameterized queries instead. When you...

How to enhance my knowledge on ui ?

19 Feb 2023 by ahmed_sa

I work as dot net web developer , I face issue to enhance my design controls and alignment and make good design, so What advice can you give me to enhance and solve this issue . i take too much time to alignment controls and give good design...

How to enhance my knowledge on ui ?

19 Feb 2023 by CHill60

It's all about using the right phrase for your reearch - Start here ui principles and guidelines - Google Search[^] Udemy is a relatively popular provider of courses - try DESIGN RULES: Principles + Practices for Great UI Design | Udemy[^] ...

How to implement movie with subtitles on my site instead of uploading it to my files ?

19 Feb 2023 by the wolf 2023

I want to create website where others can watch movies, tv shows and cartoons for free. I do know how to create that website, admin panels etc. The only thing I don't know ( because I never encountered that ) is how to implement movie with...

Bootstrap display not working in my case why? .

9 Feb 2023 by MAHESH WAGHELA

I have a div of row class in my HTML Code where I want to show three Div and hide one Div in mobile devices as per below code. ...

Bootstrap display not working in my case why? .

9 Feb 2023 by Richard Deeming

Quote: class=".d-none" The leading . is used to declare a class selector in CSS, or to query elements by class name. It should not be included in the class attribute. class="d-none"

How to add drop down list server and drop down branches on same line or rows?

30 Jan 2023 by ahmed_sa

I work on asp.net web forms . I face issue on design page print server drop down list and branches drop down list not display on same line or rows so How to make both drop down list on same line or rows by bootstrap or CSS. What I have tried: ...

How to add drop down list server and drop down branches on same line or rows?

30 Jan 2023 by Richard Deeming

Take off the Width and Height from both lists. The form-control class will set the list to 100% width; if you want the labels to display on the same line as the lists, you can't put then in the same container. Either split them out into separate...

MEAN Stack with Angular 4, Auth0 Auth & JWT Authorization - Part 3

23 Jan 2023 by Yaseer Mumtaz

Authentication & Authorization using Auth0 & JWT

How do I get rid of excess space on the right side of my page?

22 Jan 2023 by Stella Ojideh

*New to coding and desperately need some help* My site looks great on desktop but when opened within a smaller screens (mobiles & some tablets) there's excess space on the right side of the page. And also the navbar completely disappears. Any...

How do I get rid of excess space on the right side of my page?

22 Jan 2023 by Graeme_Grant

I am not seeing excessive space on the right, however, you have a few issues, like the disappearing navbar. To fix this issue: 1. CSS Section markers: \\\\ Order CSS \\\\\ should be: /* \\\ Order CSS \\\\ */ 2. If using position:...

How do I insert colors into a table..

21 Jan 2023 by Steveb1307

Hi, I have a table which will be a Master Color Table and therefore I will list around 1800 Colors by PMS number and will also have the Color Hex for each PMS number. I want to dislpay the Color dependent on the Hex in the cell that contains the...

C#7.0

How do I insert colors into a table..

21 Jan 2023 by Graeme_Grant

I am not sure where you want to put it, so here I have it in a div: @Html.Raw(item.ColorHex) UPDATE So this line? @Html.DisplayFor(modelItem =>...

C#7.0

How do I make the text that is inside a half capsule shape?

11 Dec 2022 by Abhilash.J.A

Hi, TOTAL AMOUNT 200 What I have tried: How can I include the text that is inside a half capsule shape.

How do I make the text that is inside a half capsule shape?

10 Dec 2022 by Sandeep Mewara

You can achieve it using border-radius. Here, have a look: CSS Rounded Corners[^] Examples: #rcorners1 { border-radius: 25px; background: #73AD21; padding: 20px; width: 200px; height: 150px; } #rcorners2 { border-radius: 25px; ...

Best course on bootstrap to learn bootstrap for someone who requires more mentoring?

28 Nov 2022 by bhaskar977

I'm struggling with frontend. Although my basics of html,css are clear, I'm having trouble in building websites and I'm just putting baby steps towards it(made my first simple html css site today). Thus a guidance from a mentor would be really...

Best course on bootstrap to learn bootstrap for someone who requires more mentoring?

28 Nov 2022 by CHill60

You're somewhat off topic for this Quick Answers forum and any answers are going to be very subjective - what is "best" for me may not be best for you. If you want to learn Bootstrap then can I suggest that you use bootstrap resources rather...

How do I find a website builder that is as WYSIWYG like wix.com website editor that will output ASP.NET razor/bootstrap? SASS?

12 Nov 2022 by Brian C Hart

Hi, I would rate myself as somewhat an experienced web developer, however, most of my expertise focuses on the back-end/busiless logic layer sides of websites. Usually, the graphic-design of my website is left to someone else on the team who generates beautiful jQuery/JavaScript/AJAX enabled...

How to properly structure foreach results in a razor page.

8 Nov 2022 by Member 15825061

I am including a Foreach in a razor page that returns the results fine, but I am only getting one row, one column for each result. I would like to create a column of 4 per row and create a new new row every 4 items returned. I have move...

Razor

How to properly structure foreach results in a razor page.

8 Nov 2022 by Richard Deeming

Move the outside of your foreach loop: @foreach (var item in Model.ResourceType) {

Razor

Bootstrap dropdown menu not visible

13 Oct 2022 by Member 14872744

This is my piece of code. I have the navbar which is visible but the drop down menu is not visible. I have copied the code from the bootstrap official site itself. I cannot see the dropdown menu and cannot understand where am I making a mistake?...

Bootstrap dropdown menu not visible

13 Oct 2022 by Member 15796449

Very simple solution for this is first of all check if you have loaded bootstrap js or not if it still doesn't work then you need to check which js file you have loaded you have to load bootstrap.bundle.js or bootstrap.bundle.min.js and it will...

I need ASP.NET code for e-book bank system

9 Oct 2022 by Member 15792563

EBook process is well organized online buying and selling of books. This system is well developed in various resources, for example Amazon site deals more about e-booking concept. The process of e-books is fully based on online, and the process...

.NET

I need ASP.NET code for e-book bank system

9 Oct 2022 by OriginalGriff

.NET

Adminlte vs pure bootstrap for a new web project?

19 Sep 2022 by Prahlad Yeri

I'm primarily a freelance backend dev and for the first time venturing on full-stack development of a non-trivial web app on my own, hence I needed some guidance. I've got all the backend stuff in php/mysql covered, I just want to know what's...

Design

web_development

Hide bootstrap carousel indicators when there is only one content

1 Sep 2022 by Member 14783397

I currently build my Carousel in my JS from my XML file, where I declare img path etc. Now I have the issue that my Carousel contain just one image sometimes and if that's so, I want to hide my carousel-control and my carousel-indicators How can...

Modal not pop up bootstrap5

24 Aug 2022 by khalid4775

Hello ... Iam geeting this issue that modal wont pop up bootstrap5 when i add the id

Laravel

Partial view is obstructed and not showing properly in ASP .NET MVC

15 Jul 2022 by Graeme_Grant

I can't see what html is being rendered, so it makes it difficult to see the full picture of what is happening. At a guess, the header/navbar is using class app / position: absolute;. Your Content container element has margin-top: 0;, electively...

Partial view is obstructed and not showing properly in ASP .NET MVC

15 Jul 2022 by Member 15341738

Hello, I am now working on a .NET MVC app and have a problem with my partial view. It renders within main view, but the top of the partial view which I mentioned before is being cut at the top. Here are pictures: This is how it looks now This is...

Active accordion style

24 Jun 2022 by Graeme_Grant

I'm looking at Accordion · Bootstrap v5.0[^] from their documentation. If you open the browser dev tools, you can see the styling of the accordion button when it is open and closed. When open, the following classes/rules are set:...

Active accordion style

24 Jun 2022 by Member 14783397

I am using the default Accordion of Bootstrap: https://getbootstrap.com/docs/5.0/components/accordion/ When the Accordion is active, the whole Accordion Button will change it's color. I want to just put a small block on the left for the active...

Mvc - login form text input background color

2 Jun 2022 by #realJSOP

Using Bootstrap 5 I want to change the background color of the login credential text input controls I can change the control's background, but there's a yellow mask being applied that keeps me from realizing my nefarious plan. Does anyone know...