Table Editor select labels

Topic: Table Editor select labels

Mighty Midget pro asked 5 years ago

I've just purchased the table editor plugin and I'm setting it up and I'm getting different behaviours for the select controls on the Add and Edit modal dialog boxes.

Expected behavior Select dropdowns with labels The labels are in the correct place on the dropdowns. Actual behavior enter image description here The labels are in the incorrect place on the dropdowns Resources (screenshots, code snippets etc.) The code snippet is used for both modals (with different id values)

<div class="md-form mb-5">
<select class="mdb-select md-form" id="inputCargPdf"
        autocomplete="off">
    <option value="" disabled selected>Choose your option
    </option>
    <option value="Yes">Yes</option>
    <option value="No">No</option>
</select>
<label for="inputCargPdf">CARG PDF</label>

Add comment

Marta Szymanska staff pro premium answered 5 years ago

0 0 Best answer

Hi,

would you create a snippet showing the problem here: https://mdbootstrap.com/snippets/? I'll try to help you.

Best, Marta

Mighty Midget pro commented 5 years ago

https://mdbootstrap.com/snippets/jquery/mighty-midget/1128179

Hope this is what you need.

Marta Szymanska staff pro premium commented 5 years ago

Hi,

try this code: https://mdbootstrap.com/snippets/jquery/marta-szymanska/1133711

Best, Marta

Mighty Midget pro commented 5 years ago

Hi Marta,

Thank you for your help but on my original code I have that javascript call already and it is giving me the inconsistent dialog boxes as shown in the screen shots.

In the snippet you have the table row isn't selectable, what needs to be added so that it can be selected and the edit button functioning?

Marta Szymanska staff pro premium commented 5 years ago

Hi,

I added each material select in a div with a .col-* class and with a .row wrapper because to avoid overlapping labels on select you need to wrap select with a div which has position:relative.

Best, Marta

Mighty Midget pro commented 5 years ago

I've managed to workaround the issue by adding the class 'active' to the labels that were displaying incorrectly.

Marta Szymanska staff pro premium commented 5 years ago

Hi,

I'm glad you found a workaround.

Best, Marta

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Answered

Specification of the issue

User: Pro
Premium support: No
Technology: MDB jQuery
MDB Version: 4.8.8
Device: PC
Browser: Firefox
OS: Windows 10
Provided sample code: No
Provided link: No

Mighty Midget

Pro User

45Support score
3Questions 3Answers

0Snippets likes 1Snippets