12 hour format for data entry

12 hour format for data entry

mmontoyammontoya Posts: 84Questions: 27Answers: 4

How do I let the users enter 12hour format data entry (4:30pm) but have it save to a mySql field that is time format? Or is there such thing as a time picker?

Answers

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4

    Ok, I found: https://editor.datatables.net/plug-ins/field-type/editor.datetimepicker-2

    Having some trouble getting it to display after I select a time and click save it displays all zeros (which is what is saved to the database). But when I click in the fields I see the value that was last selected in the date/time picker.I see the same value if I click in all the rows

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4

    code:

    // Build our Editor instance and process the data coming from _POST
    Editor::inst( $db, 'Appointments', 'AppointmentID' )
        ->fields(
            Field::inst( 'Appointments.AppointmentID' ),
            Field::inst( 'Appointments.uid' )
                    ->setValue($uid),
            Field::inst( 'Appointments.StatusID' )
                    ->validator( 'Validate::notEmpty' )
                    ->options( 'StatusOptions', 'StatusID', 'Status' ),
            Field::inst( 'StatusOptions.Status' ),  
            Field::inst( 'Appointments.ReferralID' )
                    ->setValue($rid),               
            Field::inst( 'Appointments.CustomerID' )
                    ->setValue($cid),               
            Field::inst( 'Appointments.AppointmentDate' )
                    ->validator( 'Validate::notEmpty' )
        )
        ->leftJoin('StatusOptions','StatusOptions.StatusID','=','Appointments.StatusID')
        ->where($field,$id,'=')
        ->process( $_POST )
        ->json();
    
          appointmentsEditor = new $.fn.dataTable.Editor( {
                  serverSide: true,
                  ajax: "lib/getAppointments.php?id="+GetURLParameter("id")+"&uid="+uid+"&t=c",
                  table: "#appointmentsTable",
                  fields: [            
                    {
                      label: "Appointment Date",
                      name: "Appointments.AppointmentDate",
                      type: "datetime"
                    },
                    {
                      label: "Appointment Status",
                      name: "Appointments.StatusID",
                      type: "select"
                    }
                  ]
              } );
    
              var appointmentsTable = $('#appointmentsTable').DataTable( {
                  //jQueryUI: "true",
                  //dom: "Tfrtp",
                  lengthChange: false,
                  autowidth: "false",
                  ajax: "lib/getAppointments.php?id="+GetURLParameter("id")+"&uid="+uid+"&t=c",
                  columns: [
                        {data: "Appointments.AppointmentDate"},
                        {data: "StatusOptions.Status", editField: "Appointments.StatusID"}
                  ]   
              } );
    
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin

    Have you set a format for the date time picker, as noted in its documentation? For example you might use format: 'LT' in the opts object for the field. You would also need a deformatter on the server-side to confirm to an SQL time (assuming you are not just storing it as a text string). See the formatters documentation.

    Allan

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4

    I am having trouble figuring out what syntax to use.

    The field in mySQL is datetime. I have tried various things and get an error. This one doesn't get me an error but still not working. I would like for the date/time to show up as mm/dd/yyyy 3:30pm and write to mySQL in correct datetime format.

            Field::inst( 'Appointments.AppointmentDate' )
                    //->validator( 'Validate::dateFormat', array(
                    //                "format"  => Format::DATE_ISO_8601,
                    //                "message" => "Please enter a date in the format yyyy-mm-dd"
                    //            ) )
                                ->getFormatter( 'Format::date_sql_to_format', Format::DATE_ISO_8601 )
                                ->setFormatter( 'Format::date_format_to_sql', Format::DATE_ISO_8601 )
    
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin

    Have you tried it with the date format that you want?

    ->getFormatter( 'Format::date_sql_to_format', 'm-d-Y H:ia' )
    ->setFormatter( 'Format::date_format_to_sql', 'm-d-Y H:ia' )
    

    If you get an error with that, what is the error?

    Allan

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4

    I get the following error:
    SQLSTATE[23000]: Integrity constraint violation: 1048 Column 'AppointmentDate' cannot be null

    Editor::inst( $db, 'Appointments', 'AppointmentID' )
        ->fields(
            Field::inst( 'Appointments.AppointmentID' ),
            Field::inst( 'Appointments.uid' )
                    ->setValue($uid),
            Field::inst( 'Appointments.StatusID' )
                    ->validator( 'Validate::notEmpty' )
                    ->options( 'StatusOptions', 'StatusID', 'Status' ),
            Field::inst( 'StatusOptions.Status' ),  
            Field::inst( 'Appointments.ReferralID' )
                    ->setValue($rid),               
            Field::inst( 'Appointments.CustomerID' )
                    ->setValue($cid),               
            Field::inst( 'Appointments.AppointmentDate' )
                    //->validator( 'Validate::dateFormat', array(
                    //                "format"  => Format::DATE_ISO_8601,
                    //                "message" => "Please enter a date in the format yyyy-mm-dd"
                    //            ) )
                                ->getFormatter( 'Format::date_sql_to_format', 'm-d-Y H:ia' )
                                ->setFormatter( 'Format::date_format_to_sql', 'm-d-Y H:ia' )
    
        )
        ->leftJoin('StatusOptions','StatusOptions.StatusID','=','Appointments.StatusID')
        ->where($field,$id,'=')
        ->process( $_POST )
        ->json();
    
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin

    I would suggest first of all commenting the validator back in and using the appropriate date format for what you expect to be submitted.

    The next thing to do would be to check what format is actually being submitted. You can use the developer tools in your browser to inspect the Ajax request and see what that is.

    Allan

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4
    edited July 2015

    Here is the Ajax request:

    {"row":{"DT_RowId":"row_25","Appointments":{"AppointmentID":"25","uid":"1","StatusID":"2","ReferralID":null,"CustomerID":"1","AppointmentDate":null},"StatusOptions":{"Status":"Completed"}}}
    

    So then I changed a few things. First in mySQL I changed the field to be text instead of datetime. It still was sending a null. Second, with the field still being text format, I changed commented out the get/set formatter lines in the Editor. Then it saved. Then, leaving the two lines commented out I changed the field back to datetime format. After doing this it was returning all zeros, here is the Ajax being returned:

    {"row":{"DT_RowId":"row_29","Appointments":{"AppointmentID":"29","uid":"1","StatusID":"2","ReferralID":null,"CustomerID":"1","AppointmentDate":"0000-00-00 00:00:00"},"StatusOptions":{"Status":"Completed"}}}
    

    Note: when it did save (text field with no get/set formatters) it saves as '07/14/2015 9:27 PM'

  • mmontoyammontoya Posts: 84Questions: 27Answers: 4
    edited July 2015

    Now when it did save (text field with no get/set formatters) it saves as '07/14/2015 9:27 PM'

    That is making me think I need to change the timepicker plugin. I want to keep it so the user still sees the m/d/yyyy hh:mm am/pm' but I'm guessing I need it to save as a format mysql likes for datetime.

    I currently have the datepicker straight from the 'minimum setup' format and have no idea how to change it.

    $.fn.dataTable.Editor.fieldTypes.datetime = $.extend( true, {}, $.fn.dataTable.Editor.models.fieldType, {
        "create": function ( conf ) {
            var that = this;
     
            conf._input = $(
                    '<div class="input-group date" id="'+conf.id+'">'+
                        '<input type="text" class="form-control" />'+
                        '<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>'+
                        '</span>'+
                    '</div>'
                )
                .attr( $.extend( {}, conf.attr ) )
                .datetimepicker( $.extend( {}, conf.opts ) );
     
            return conf._input[0];
        },
     
        "get": function ( conf ) {
            return conf._input.children('input').val();
        },
     
        "set": function ( conf, val ) {
            conf._input.data("DateTimePicker").setDate( val );
        },
     
        // Non-standard Editor methods - custom to this plug-in. Return the jquery
        // object for the datetimepicker instance so methods can be called directly
        inst: function ( conf ) {
            return conf._input.data("DateTimePicker");
        }
    } );
    
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin

    Here is the Ajax request:

    That looks like the Ajax return. Can you show me the data submitted to the server - you might have to click on a "Header" tab.

    Thanks,
    Allan

This discussion has been closed.