Topic: Is there anyway to add a normal html select box to your modal window?
Start your code here<div id="JobType" class="modal fade" data-backdrop="static"> <div class="modal-dialog modal-md"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Add A Job</h4> <button type="button" class="close ml-auto" data-dismiss="modal" id="xclose"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button> </div> <div id="modalBody" class="modal-body"> <select id="ssd" style="z-index:99999"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <center> <button type="button" style="width:220px; height:140px" id="NewJob" class="btn btn-outline-info waves-effect btn-lg"><i class="fa fa-wrench fa-4x" style="font-size:50px; color:lightgray"></i><br /><br />Add Job</button> <button type="button" style="width:220px; height:140px" id="NewQuote" class="btn btn-outline-info waves-effect btn-lg"><i class="fa fa-tasks fa-4x" style="font-size:50px; color:lightgray"></i><br /><br />Add Quote</button> </center> </div> </div> </div> </div>
garethdebruyn pro commented 7 years ago
Hi Marta Thank you. There's no specific visual affect I want. The affect is not the issue. I just want to be able to add a select box to a modal window. But even with a standard select box, it does not show up on a modal window. The other problem I had was that I wanted to add options to the select box dynamically, but i cant even reference the select by ID using jquery. Its like its just not on the page. If I use mdb select I can see the select box displayed with its options I hard coded, if i use a standard select box i cant see it in the modal. But in both cases I cant dynamically add options to the select. With my question i was hoping that i could just get the fact that i cant see the select working first. Then i wanted to sort out the issue that causes me to not be able to reference it.
garethdebruyn pro commented 7 years ago
Awesome, will do. Thank you Marta.Marta Szymanska staff pro premium commented 7 years ago
No problem. I'm waiting for your message.
Hello there,
garethdebruyn, did you have an answer to your question?
I have the same issue: I want to use a standard <select> with a standard Bootstrap layout, and a standard checkbox but none of them show up.
I do not want to have to initialize all of my selects manually with Javascript.
I managed to have my selects display by modifying the mdb.css file and displaying them there, which will not help if I want to use the MDB Select but I'll be good for now.
Thanks,
Sylvain
garethdebruyn pro commented 7 years ago
Hi Sylvain I'm not sure why they did this but it seems like you have to use js to initialize your selects. Also using jquery, I could not find the select using its ID. I don't want to get 75% into my project and find I just cant do something because these guys are doing something strange. Looked to be a great project but its just to risky for me to continue with it. Its very disappointing.
Hi,
We want to help you guys but I need to know what exactly you want to get from us. Do you want a select like in the bootstrap documentation here? Please look at this section and input with label "Example select".
Best,
Marta
sylvainadam pro commented 7 years ago
Hello Marta, Thank you for your answer. Well, it's rather simple. I would like to get a select when I add a "select" element, but it's always hidden. How do you get a standard select, or checkbox for that matter? Thanks, Sylvain
sylvainadam pro commented 7 years ago
Ah - thank you Marta - I missed this one. That would have been nice that our select wasn't hidden by default :). Also, I would suggest you put the "select" element documentation where all of your inputs are in "Components" -> "Inputs", which is where I was looking at first. Second, I use Zend_Form decorators to generate forms. My checkboxes come in this form: <div class="form-group"> <div class="checkbox"> <label> <input type="hidden" name="activeAccount" value="0"> <input type="checkbox" name="activeAccount" id="activeAccount" value="1" checked="checked"> The account is active </label> <p class="help-block">Untick this box if you want the account not to be active.</p> </div> </div> It's not showing by default. I don't have an easy way to modify the decorators, but from what I've seen the checkbox container isn't right for MDB Bootstrap. Your documentation shows the checkbox input in a .form-group div and nothing else. How can I make that checkbox show? Thanks! SylvainFREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: Yes
- Provided link: No