Modal form ajax loaded input fields init form display

  1. MDB Home Page
  2. Support Main Page
  3. MDB jQuery
Topic: Modal form ajax loaded input fields init form display

morgan_chester pro premium asked 6 years ago

Have a modal which is created after the containing form loaded from ajax, so I need to initialize a nice view of mdboostrap inputs after the modal is shown. What's the best way to?

ionyx pro answered 6 years ago

I had same issue as well. if you load a form via Ajax, it renders the input values with the placeholders appearing directly over the top of the input field value. found answer here: https://mdbootstrap.com/support/initialize-input-fields-loaded-with-ajax/ Just add  class="active" to your <label> field and it will render correctly after loading from ajax  

Piotr Glejzer staff commented 6 years ago

HI ionyx, thank you for that answer. Have a nice day! Best, Piotr

Piotr Glejzer staff answered 6 years ago

Hi, You can customize your inputs form our documentation. Did you use our documentation about inputs? Here is a link : Bootstrap Inputs group or Inputs or if you want you can use javascript/jquery to change a view of inputs after showed modal. https://mdbootstrap.com/javascript/modals/#auMethods Is that resolve your problem? If not let me know I will try to help you again. Best, Piotr

morgan_chester pro premium commented 6 years ago

no, I mean how to initialize an input view if an input is created on-the-fly or loaded from ajax? It hasn't a nice material label and other material styles like those displayed on the page load

Piotr Glejzer staff commented 6 years ago

Can you show me an example of what did you try to do or what do you expect or what is not working? It will help a lot.

lede pro premium answered 6 years ago

This seems to be a common problem. It should have some instructions for this in the modal demo page I think. I have a form where some of the fields are populated and some aren't so I'm checking each one rather than just adding the active class to every field because that doesn't look right either 
$('#location').val(event.location);
if(event.location != '') { $('label[for="location"]').addClass('active'); }

Piotr Glejzer staff commented 6 years ago

Thank you for your advice. Have a nice day.
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

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
morgan_chester
Pro User Premium support
10Support score
1Questions 1Answers
0Snippets likes 0Snippets