Topic: Angular Bootstrap checkbox does not work

Torres pro asked 5 years ago


I copy and paste the code from the examples and does not work :
<mdb-checkbox>Material unchecked</mdb-checkbox>

Arkadiusz Idzikowski staff answered 4 years ago


@xzesstence

We always update the examples in documentation if the components code changes. Recently we have reviewed all documentation pages to correct potential errors. If there are still any problems, we would be happy to hear about them and improve the docs as soon as possible.

We constantly upgrade our product, based on feedback from the users. We would be very grateful if you would like to provide more details about the problems with MDB Angular.


xzesstence pro answered 4 years ago


@Arkadiusz Idzikowski

If framework changes you should update the docs at the same time before releasing it. You can pick most elements from mdb... and are lost if you work on something in a productive scenario... if you then have a small deadline, you are hopeless lost..

I'm very still very disappointed of MDB and this is the last time i will use MDB for any software...there is so much better stuff to use.. Semantic UI, Grommet, Primeng and many more. I just began a small project with MDB because i like the look of the material elements but i still noticed: there are so many questions and documentation holes left.

(Sorry if the following sounds rude, but this is because im really annoyed)

Therefore, I wonder if not wrongly what MDB works at all if not the documentation? You have not invented Bootstrap, Angular, React, or JQuery, but the components are mostly semiprofessional. If you look at the components and the existing documentation, it seems like you have absolutely no plan of Typescript and object-oriented programming.


Arkadiusz Idzikowski staff answered 5 years ago


Could you provide a demo app on which I would be able to debug this problem (you can send it to me on: a.idzikowski@mdbootstrap.com). Are there any errors in console?

herve pro answered 5 years ago


Hello, Yes, the problem is that only the label is displayed. In order to have a material checkbox working i have to use this syntax :
<input class="form-check-input filled-in" type="checkbox" [(ngModel)]="valChk1" id="filledInCheckbox1">
<label for="filledInCheckbox1">Unselected</label>
Thank you

Arkadiusz Idzikowski staff answered 5 years ago


Hello, Thank you for the confirmation. The checkboxes you see in our documentation are only for visual presentation (they are not written in Angular). Are there any problems with this component when you use it in your Angular app? Regards, Arek

herve pro answered 5 years ago


Hello Arek, here is the link to the documentation : https://mdbootstrap.com/angular/forms/checkbox/ when i display the source code I don't see <mdb-checkbox...  but this :
<div class="custom-control custom-checkbox">
        <input type="checkbox" class="custom-control-input" id="defaultUnchecked">
        <label class="custom-control-label" for="defaultUnchecked">Default unchecked</label>
</div>
I sent you the information about my pro account by mail

Arkadiusz Idzikowski staff answered 5 years ago


Hello, Could you provide a link to the documentation where the old syntax is used? Please show me the code of the checkbox you are using. If you want to use material checkbox I would need the confirmation of your order which I asked about in this topic: https://mdbootstrap.com/support/angular/trigger-date-picker-on-button-click/ Material checkbox is a pro component and according to our system you use free version. If you purchased pro version, please send confirmation of your order or registered email to a.idzikowski@mdbootstrap.com, so we can fix this problem. Regards, Arek    

herve pro answered 5 years ago


Good morning, I use version 6.2.6 and the mdb-checkbox do not work either. Moreover when I look at the code on your page, you still use the old syntax, is there a reason? do you recommend keeping the old notation? thank you hervé

Arkadiusz Idzikowski staff answered 5 years ago


Dear Torres, Mdb-checkbox is new syntax that was added in version 6.2.2. Please upgrade your version or use old syntax:
<div class="form-check">

<inputclass="form-check-input"mdbInputDirectivetype="checkbox"id="checkbox1">

<labelclass="form-check-label"for="checkbox1">Classic checkbox</label>

</div>

Regards,
Arek


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 6.2.1
  • Device: computer
  • Browser: any
  • OS: any
  • Provided sample code: Yes
  • Provided link: No