1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: Modal not usable greyed // ausgegraut - keine Reaktion

sebastian.bleuel99 free asked 7 years ago

Guten Tag, Ich wollte in meine HTML-Page ein Modal einfügen, jedoch wird dieses immer wieder ausgegraut, ohne zu wissen warum. Könntet ihr mir helfen? null 
<button type="button" class="btn btn-primary btn-sm orange" data-toggle="modal" title="bearbeiten" data-toggle="modal" data-target="#changeModal"><i class=" fa fa-pencil"></i></button>

                                                            
                                                            <div class="modal fade modal-ext" id="changeModal" tabindex="-2" role="dialog" aria-labelledby="changeModal" aria-hidden="true">
                                                                <div class="modal-dialog" role="document">
                                                                    <div class="modal-content">
                                                                        <div class="modal-header">
                                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                                <span aria-hidden="true">&times;</span>
                                                                            </button>
                                                                            <h4 class="modal-title" id="myModalLabel">&nbsp;</h4>
                                                                            <h4 class="modal-title" id="myModalLabel">Bearbeitung</h4>
                                                                        </div>
                                                                        <div class="modal-body">
                                                                            Änderungen eintragen:

                                                                            <br>
                                                                            <div class="md-form">
                                                                                <input type="text" id="form32" class="form-control">
                                                                            </div>
                                                                            <div class="text-xs-center">
                                                                                <button class="btn btn-primary">Übernehmen</button>
                                                                            </div>
                                                                        </div>
                                                                        <div class="modal-footer">
                                                                            <button type="button" class="btn btn-default" data-dismiss="modal">Schliessen</button>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>

Marta Wierzbicka staff answered 7 years ago

So please send me files on mail m.szymanska@mdbootstrap.com

sebastian.bleuel99 free answered 7 years ago

What did you need exactly because I have no direct Webpage. It´s all local.

Marta Wierzbicka staff answered 7 years ago

Can we see some demo of your website? Because maybe it isn't problem with modal but with other thing.

sebastian.bleuel99 free answered 7 years ago

My Browser is Chrome in the latest version and the plugins I have make no problems. Th software I use to develop the website is Brackets and XAMMP to have a local webserver. And when I click the button the modal is comming down but the screen gets like blocked and goes like a little grey and nething can be used on the site. and and without the modal it looks like this where you can make the normal part of the site.

Marta Wierzbicka staff answered 7 years ago

Can you give more details, e.g. what kind of browser do you use and version; do you have any plugins in the browser that could cause a conflict. Because I can't recreate your problem.

sebastian.bleuel99 free answered 7 years ago

It's the free version (3)... but at the first time I used it it works well but after I restarted my PC ist doesn't work like it should be.

Bartłomiej Malanowski staff answered 7 years ago

What is your version of MDB?

sebastian.bleuel99 free answered 7 years ago

Hi thanks for reply, I would like to add a modal to my HTML-Page but when I added it into the code the live preview of the code shows me only a greyed screen. The action behind the funktion works perfectly but the page get a little greyed and the only thing you can do is cloing the explorer. So what kind of problem ist it? Picture 


<button type="button" class="btn btn-primary btn-sm orange" data-toggle="modal" title="bearbeiten" data-toggle="modal" data-target="#changeModal"><i class=" fa fa-pencil"></i></button>

                                                            
                                                            <div class="modal fade modal-ext" id="changeModal" tabindex="-2" role="dialog" aria-labelledby="changeModal" aria-hidden="true">
                                                                <div class="modal-dialog" role="document">
                                                                    <div class="modal-content">
                                                                        <div class="modal-header">
                                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                                <span aria-hidden="true">&times;</span>
                                                                            </button>
                                                                            <h4 class="modal-title" id="myModalLabel">&nbsp;</h4>
                                                                            <h4 class="modal-title" id="myModalLabel">Bearbeitung</h4>
                                                                        </div>
                                                                        <div class="modal-body">
                                                                            Änderungen eintragen:

                                                                            <br>
                                                                            <div class="md-form">
                                                                                <input type="text" id="form32" class="form-control">
                                                                            </div>
                                                                            <div class="text-xs-center">
                                                                                <button class="btn btn-primary">Übernehmen</button>
                                                                            </div>
                                                                        </div>
                                                                        <div class="modal-footer">
                                                                            <button type="button" class="btn btn-default" data-dismiss="modal">Schliessen</button>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>

Bartłomiej Malanowski staff answered 7 years ago

Could you please write your message again in English?
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

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

Specification of the issue
  • ForumUser: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
About author
sebastian.bleuel99
10Support score
2Questions 4Answers 0Snippets