Meta Box

Date picker conditions

Support › General › Date picker conditionsResolved

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • November 10, 2020 at 6:07 AM #22769
    toni birdtoni bird
    Participant

    Hi I was wondering if I have 2 date fields (start /finish) can I add a condition to finish date be grater than start date in backend (adm panel)?
    Also is it possible to have a exact copy of a custom field populated automatically. i.e as soon as I add start date, a text field value becomes that date?

    Many thanks

    November 10, 2020 at 3:24 PM #22779
    Long NguyenLong Nguyen
    Moderator

    Hi Toni,

    The field date does not support adding the minDate base on another field date value. I'm going to create a feature request for the developer team to support this case.

    Regarding the text field is populated by the value of a date field's value, you can use some simple JavaScript code. start_date and date_to_text are the field IDs.

    add_action( 'admin_footer', function() {
    ?>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            $('body').on('change', '#start_date', function() {
                var startDate = $('#start_date');
                $('#date_to_text').val(startDate.val());
            });
            
        });
    </script>
    <?php
} );

    See the screen record https://share.getcloudapp.com/ApuLbJqN.

    November 10, 2020 at 10:09 PM #22791
    toni birdtoni bird
    Participant

    Hi Long,

    Many thanks for you help, can't wait to get de conditional date based on another date field working..... please let us know when is out...

    I've managed to get the javaScript working but only when the "date_to_text" field is outside a group , any chance to work inside groups? Start date is out and date_to_text is inside a group...

    thanks again

    November 11, 2020 at 8:51 AM #22795
    Long NguyenLong Nguyen
    Moderator

    Hi Toni,

    Sub-fields in a group have different IDs (HTML attribute id), the format is {group_id}_{field_id}. Assume your group field id is group_date, change the selector in the JavaScript code to:

    $('#group_date_date_to_text').val(startDate.val());

    November 11, 2020 at 8:03 PM #22809
    toni birdtoni bird
    Participant

    Hi Long,

    many thanks, works beautifully...

    regards

    November 11, 2020 at 8:54 PM #22810
    toni birdtoni bird
    Participant

    Hi Long,

    Does it also work with cloned groups?

    thanks

    November 12, 2020 at 9:26 AM #22815
    Long NguyenLong Nguyen
    Moderator

    Hi,

    The ID of the field when rendering to HTML code for a cloneable group is very complicated. You can add a custom class to the field text.

    array(
    'name' => 'Group date',
    'id' => 'group_date',
    'type' => 'group',
    'clone' => true,
    'fields' => array(
        array(
            'name' => 'Date To Text',
            'id' => 'date_to_text',
            'type' => 'text',
            'class' => 'date_to_text' // here
        ),

    ),
)

    then change the selector in JavaScript code to

    $('.date_to_text input').val(startDate.val());

    to make all text fields in the cloneable group populate the date from the start date.

    November 12, 2020 at 9:08 PM #22821
    toni birdtoni bird
    Participant

    Hi Long,

    Great, many thanks

    November 13, 2020 at 12:48 AM #22823
    toni birdtoni bird
    Participant

    Hi Long, last doubt/question on this matter.

    If I have the following scenario :

    Group date with a date field that populates the date_to_text field ( just like you told me ) works well within the group. but when I clone this group does not work anymore because all fields get a new name ( i.e. start_date_hlksjdhfk) any way to make the cloned groups to work independently within the group itself? Many thanks

    <?php
add_filter( 'rwmb_meta_boxes', 'your_prefix_register_meta_boxes' );

function your_prefix_register_meta_boxes( $meta_boxes ) {
    $prefix = '';

    $meta_boxes[] = [
        'title'      => esc_html__( 'testing', 'text-domain' ),
        'id'         => 'testing',
        'post_types' => ['post'],
        'context'    => 'normal',
        'priority'   => 'high',
        'fields'     => [
            [
                'id'            => $prefix . 'group_date',
                'type'          => 'group',
                'name'          => esc_html__( 'Group Date', 'text-domain' ),
                'fields'        => [
                    [
                        'id'   => $prefix . 'start_date',
                        'type' => 'date',
                        'name' => esc_html__( 'Start_date', 'text-domain' ),
                    ],
                    [
                        'id'    => $prefix . 'date_to_text',
                        'type'  => 'text',
                        'name'  => esc_html__( 'Date to text', 'text-domain' ),
                        'class' => 'date_to_text',
                    ],
                ],
                'clone'         => 1,
                'default_state' => 'expanded',
                'clone_default' => 1,
            ],
        ],
    ];

    return $meta_boxes;
}
    November 15, 2020 at 10:52 PM #22855
    Long NguyenLong Nguyen
    Moderator

    Hi Toni,

    You need to add a class for the start date.

    array(
    'name' => 'Group date',
    'id' => 'group_date',
    'type' => 'group',
    'clone' => true,
    'fields' => array(
        array(
            'name' => 'Date To Text',
            'id' => 'date_to_text',
            'type' => 'text',
            'class' => 'date_to_text'
        ),
        array(
            'name'       => 'Start Date',
            'id'         => 'start_date',
            'type'       => 'date',

            // Date picker options. See here http://api.jqueryui.com/datepicker
            'js_options' => array(
                'dateFormat'      => 'yy-mm-dd',
                'showButtonPanel' => false,
            ),
            'class' => 'start_date' // here
        ),

    ),
),

    then change the JavaScript code to:

    $('body').on('change', '.start_date input', function() {
    var startDate = $(this);
    startDate.parents('.rwmb-group-clone').find('.date_to_text input').val(startDate.val());
});

    See my screen record https://share.getcloudapp.com/d5upZkj0.

    November 17, 2020 at 8:50 AM #22872
    toni birdtoni bird
    Participant

    Many thanks Long, saved my life. regards

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.