Formly Form is creating invalid html element ids

[funktioneer]

Example input field auto generated by formly form:

<input ng-model="model[options.key]" type="text" data-error-container="#AngularBarcode_title" id="cs.form_qrinput_facebook_url_2" name="cs.form_qrinput_facebook_url_2" formly-custom-validation="" ng-model-options="options.modelOptions" required="true" pattern="^http://|(www.)?[a-z0-9]+([-.]{1}[a-z0-9]+)*.[a-z]{2,5}(:[0-9]{1,5})?(/.*)?" placeholder="http://www.qr-code-generator.com" class="ng-pristine ng-invalid ng-invalid-required ng-valid-pattern ng-touched">

As you can see the id contains a dot: id="cs.form_qrinput_facebook_url_2"

if you try to access this id with jQuery("#cs.form_qrinput_facebook_url_2"); you won't get the element

How can we solve this isssue?

Best, Nils

[funktioneer]

With the given selector "#cs.form_qrinput_facebook_url_2" jQuery is looking for this: <div id="cs" class=".form_qrinput_facebook_url_2">

It's possible to get a workarround using $("[name='cs.form_qrinput_facebook_url2'"); but I think it is an improvement to fix this issue by replacing the "." with ""

Best,Nils

[funktioneer]

Got fixed it, the issue was to name the form like in the examples with name="cs.form" this is added during the dynamic id creation.

Best,Nils