1. Fabrik 3.9 has been released. If you have updated Joomla to 3.9, this is a required update.
    Dismiss Notice

How can I add days to date in repeat group?

Discussion in 'Community' started by viawebcenter, Apr 9, 2018.

  1. viawebcenter

    viawebcenter New Member

    Level: Community
    I have 3 elements:

    first_date (date element) = fab_entregables_20_repeat___fecha_inicio
    add_days (field element) = fab_entregables_20_repeat___plazo
    final_date (field element) = fab_entregables_20_repeat___fecha_presentacion

    I need this:

    first_date + add_days = final_date

    How can I do it in repeat group?

    I will appreciate your help

    I found this post about, but is not for repeat group:

    function addDays(el) {
    // get initial date from element
    var initialDate = el.form.formElements.get('fab_entregables_20_repeat___fecha_inicio').getValue();
    // get days to add from element
    var days = el.form.formElements.get('fab_entregables_20_repeat___plazo').getValue();
    // create new date object from initial date
    var result = new Date(initialDate);
    // add days to date
    result.setDate(result.getDate() + days.toInt());
    // set final date element to formatted result el.form.formElements.get('fab_entregables_20_repeat___fecha_presentacion').update(result.format('%Y-%m-%d %H:%i:%s;));


    Thanks

    Francisco Reyes
     
  2. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    You'll need to add the "repeat num" of the element triggering the function to the other element names ...

    Code (Text):

    function addDays(el) {
       // get the repeat num
       var repeatNum = el.getRepeatNum();
       // get initial date from element
       var initialDate = el.form.formElements.get('fab_entregables_20_repeat___fecha_inicio_' + repeatNum).getValue();
       // get days to add from element
       var days = el.form.formElements.get('fab_entregables_20_repeat___plazo_' + repeatNum).getValue();
       // create new date object from initial date
       var result = new Date(initialDate);
       // add days to date
       result.setDate(result.getDate() + days.toInt());
       // set final date element to formatted result
       el.form.formElements.get('fab_entregables_20_repeat___fecha_presentacion_' + repeatNum).update(
          result.format('%Y-%m-%d %H:%i:%s')
       );
    }
     
    -- hugh
     
  3. viawebcenter

    viawebcenter New Member

    Level: Community
    Thanks for your help.

    I put this code in each element (fab_entregables_20_repeat___fecha_inicio and fab_entregables_20_repeat___plazo) JavaScript plugin, but it iw not working. What is wrong?

    upload_2018-4-11_6-38-17.png
     
  4. cheesegrits

    cheesegrits Support Gopher Staff Member

    Level: Community
    Well, that just declares a function, it doesn't actually call the function. The post you found that code in almost certainly said the file ./components/com_fabrik/js/form_X.js (where X is the numeric form ID), put the function in there, then in the element Javascript code, call it like ...

    Code (Text):

    addDays(this);
     
    -- hugh
     
  5. Bren

    Bren Member

    Level: Community
    Hi Hugh & everyone.
    I just tried to do the same using 2 jdate elements and I'm receiving some strange console errors, per attached snippet. If I have it update a regular field element instead, then no errors and the data appears. Will this work with jdate? If so, how?
    Thanks in advance.
     

    Attached Files:

    Last edited: Aug 1, 2020
  6. troester

    troester Well-Known Member Staff Member

    Level: Community
    The example has the wrong time format, it must be
    result.format('%Y-%m-%d %H:%M:%S')
     
  7. Bren

    Bren Member

    Level: Community
    That worked.
    Thank you, Troester. I appreciate it.
     
  8. Bren

    Bren Member

    Level: Community
    Another issue I'm having with the jdate element is that I can't get any of the JS events to trigger. I've tried "Change", "Select", "Click", etc. What event is triggered when a date is selected from the jdate pop-up calendar?
    Thanks in advance.
     
  9. troester

    troester Well-Known Member Staff Member

    Level: Community
    blur and change are working on my site (at the moment when you left focus of the jdate element)
     
  10. Bren

    Bren Member

    Level: Community
    So, after some more testing, it appears that it only works when the jdate setting "Allow typing in field" is set to "Yes". I had mine set to "no" and non of the events work. This is a bummer, as I can see users mis-typing the correct date format.
    Here's another strange thing I discovered, which is a big deal for me at the moment. So, if I set "Allow typing in field" to "Yes" then the date selected + the dropdown of additional days appears correctly in the 2nd jdate element, but when I submit the form then the 2nd jdate always saves as todays date and not the date shown ("Default to current date" and "Always return today's date" are both set to "No"). If I instead select a date from the 2nd jdate's popup calendar then submit the form, then the date matches the selected date. Attached is a snippet of the inline JS that I have in both the 1st jdate element and the dropdown (days) element. It doesn't look like I made a mistake. Could this be a bug in the jdate element?
    Thanks in advance.
     

    Attached Files:

  11. troester

    troester Well-Known Member Staff Member

    Level: Community
    I think so.
    I got it saving the date if
    allow typing= yes
    + clicking into the date field after the new date has been inserted

    but this is no way to do it.
     
    juuser likes this.
  12. juuser

    juuser Active Member

    Level: Community
    I can confirm the "bug". Have run into the same issue a while ago. Don't remember exactly, but I probably used some workaround to solve my case.

     
  13. Bren

    Bren Member

    Level: Community
    Ya, I’m working on a work around now. I’ve unpublished the days dropdown and I’m trying to figure out how to setup a validation on the 2nd jdate where it must always be greater or = to the 1st jdate + 3 days (my previous dropdown started at 3 days). Should I use the greaterorlessthan validation plugin on the 2nd jdate? If so, how do I do greater or = to the 1st jdate + 3 days?
    Thanks in advance.
     
  14. juuser

    juuser Active Member

    Level: Community
    You would probably need to use php validation for that, something like:

    Code (Text):

    $first_date_temp = JRequest::getVar('mytable___first_date');
    $first_date = date("Y-m-d", strtotime($first_date_temp));
    $second_date = date("Y-m-d", strtotime($data. " + 3 days"));
    return  $second_date > $first_date ;
     
    P.S. this exact code not tested.
     
  15. Bren

    Bren Member

    Level: Community
    Thank you, juuser. That worked great (with a slight adjustment).
     

Share This Page