I have field with ID=singel_cal where i have a JS outside form running when clicking the form to then show a calender in popup.

But when i put it in

<cms:input name="first_day" type="bound" class="form-control" id="single_cal"/>

It doesnt work.

But if i write <input id="singel_cal" /> outside form it works.

Any ideas why? I think maybe something about the CMS tag or maybe the FORM closing!

[KK]

The reason lies here -

<cms:input name="first_day" type="bound"

Type 'bound' will take all info (including id) from the actual editable regions as defined in your template - so basically any info you provide in the form itself is simply ignored.

Do a view-source and you should see that the ID for the input would match that is used in the admin-panel proper.

You'll have to modify your JS to use the ID you see in the step above.

The reason lies here -

<cms:input name="first_day" type="bound"

Type 'bound' will take all info (including id) from the actual editable regions as defined in your template - so basically any info you provide in the form itself is simply ignored.

Do a view-source and you should see that the ID for the input would match that is used in the admin-panel proper.

You'll have to modify your JS to use the ID you see in the step above.

I see. Problem, im absolutly not a JS guy. Maybe you can see a solution modefy the code below!

Code: Select all

    <script type="text/javascript">
        $(document).ready(function () {
            $('#single_cal4').daterangepicker({
                singleDatePicker: true,
                calender_style: "picker_4"
            }, function (start, end, label) {
                console.log(start.toISOString(), end.toISOString(), label);
            });
        });
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#reservation').daterangepicker(null, function (start, end, label) {
                console.log(start.toISOString(), end.toISOString(), label);
            });
        });
    </script>

It looks like '#single_cal4' is the id that needs to be changed to the couch id that shows up in source view.

The other id referenced in the JS you posted is '#reservation'.

What do you meen with 'source id' ?

What do you meen with 'source id' ?

I mean what @KK explained above.

Do a view-source and you should see that the ID for the input would match that is used in the admin-panel proper.

- Open the page with the form on it.

- Using your browser's tools, select "View Source" for the page. (In Firefox it would be Tools>Web Developer>Page Source).

- You will find the place in the code where the id you wanted to use has been stripped out and replaced with something like id="f_my_editable_name". That is the id you want to use in your JS script.

My bad, now it works perfectly Thanks for your time