How to pass date from AngularJS Datepicker to Java Servlet?

Question

I am trying to add a date filter to my code. I want to pass the date chosen in the AngularJS Date-Picker to the Java Servlet and then call the stored procedure through the Persistence code as shown.

How do I format the dates correctly in the JavaScript and then in the Java code?

Datepicker code

<datepicker date-format="yyyyMMdd" button-prev='<i class="fa fa-arrow-circle-left"></i>'
    button-next='<i class="fa fa-arrow-circle-right"></i>'>

    <input ng-model="filters.dateFrom" type="text" placeholder="Select a starting date">

</datepicker>


<datepicker date-format="yyyyMMdd" button-prev='<i class="fa fa-arrow-circle-left"></i>'
    button-next='<i class="fa fa-arrow-circle-right"></i>'>

    <input ng-model="filters.dateTo" type="text" placeholder="Select an end date">

</datepicker>

AngularJS code

app.factory('graphService', function ($http, Restangular) {

        var exports = {};

        exports.getRestangular = function () {
            // return Restangular.setBaseUrl("/api");
            return Restangular.setBaseUrl("/apm/graph");
        };

        exports.getGraphDataDC = function (dcName, from, to) {
            return exports.getRestangular().one("graphData/DC/" + dcName + "/" + from + "/" + to).get();
        };

Java Servlet

                    List <SummaryDelaysDataCenter80Perc> dcData;

                    String dcname = pathInfo[pathInfo.length-3];
                    SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyyMMdd");

                    try {
                        from = new java.util.Date(simpleDateFormat.parse(pathInfo[pathInfo.length - 2]).getTime());
                    } catch (ParseException e) {
                        e.printStackTrace();
                    }

                    try {
                        to = new java.util.Date(simpleDateFormat.parse(pathInfo[pathInfo.length - 1]).getTime());
                    } catch (ParseException e) {
                        e.printStackTrace();
                    }

                    try
                    {
                        dcData = persistance.getSummaryDelaysDC80Perc(from, to, dcname);
                    } catch(RuntimeException e) {
                        LOGGER.error("Could not load data form database, reason: {}", e);
                        throw new ServletException(e);
                    }
                    // parse to json
                    json = ThreadsafeUtils.getGsonInstance(pretty).toJson(dcData);
                    LOGGER.debug(dcData.size() + " summary entries were read");

                    out.write(json);
                    break;

Persistence

    public List<SummaryDelaysSystem80Perc> getSummaryDelaysSystem80Perc(Date from, Date to, String systemName) throws RuntimeException {
        List<SummaryDelaysSystem80Perc> result = new ArrayList<>();
        Calendar c = Calendar.getInstance(Locale.GERMANY);
        java.sql.Date minDate;
        java.sql.Date maxDate;
        String call;
        if (from != null)
            minDate = new java.sql.Date(from.getTime());
        else
            minDate = Utils.getDBMinDate();

        if (to != null) {
            maxDate = new java.sql.Date(to.getTime());
        } else {
            maxDate = Utils.getDBMaxDate();
        }
        call = "CALL " + summaryDelaysSystemProcedureName + "(?, ?, ?, ?)";

//      sdelten80.setName(systemName);
        try {
            //prepare statement
            java.sql.Connection connection = em.unwrap(java.sql.Connection.class);
            java.sql.CallableStatement cst = connection.prepareCall(call);
            //set parameters
            cst.setDate(1, minDate, c);
            cst.setDate(2, maxDate, c);
//          cst.setString(2, to.toString());
            cst.setString(3, systemName);
            // execute statement and retrieve result
            cst.execute();
            ResultSet rs = cst.getResultSet();
            while (rs.next()) {
                SummaryDelaysSystem80Perc sdelsys80 = new SummaryDelaysSystem80Perc();
                DateFormat dateFormat = new SimpleDateFormat("dd/MM/yyyy", Locale.GERMANY);
                String strDate = dateFormat.format(rs.getTimestamp(1));
                sdelsys80.setName(rs.getString(2));
                sdelsys80.setDate(strDate);
                sdelsys80.setPerc80serverdelay(Double.toString(rs.getDouble(3)));
                sdelsys80.setPerc80networkdelay(Double.toString(rs.getDouble(4)));
                sdelsys80.setPerc80clientdelay(Double.toString(rs.getDouble(5)));
                sdelsys80.setPerc80roundtrips(Long.toString(rs.getLong(6)));
                result.add(sdelsys80);
            }
        } catch (java.sql.SQLException e) {
            throw new RuntimeException("StoredProcedureCall was not successful", e);
        }
        return result;
    }

score 0 · Accepted Answer · edited May 23 '17 at 12:33

Your datepicker needs to be in a form that posts the data. Then using the input field name, you can access the posted value.

See here as well: How to transfer data from JSP to servlet when submitting HTML form

If you don't want to use a form and have the automated browser post, you can have the $http.post in your ng-click function so something like this:

<input ng-model="filters.dateFrom" type="text" placeholder="Select a starting date">
<button ng-click="BtnClick();">Post to server</button>

in angular controller

$scope.BtnClick = function() { /* Post the values using $http.post and you can access to the input values using filters.dateFrom and filters.dateTo */

Sorry I should've mentioned, I'm using SAP HANA as a database, and the SQL data type is a timestamp, and the procedure takes the dates in this format = 'yyyyMMdd'. — Nishant Roy, Jul 06 '16 at 18:48

How to pass date from AngularJS Datepicker to Java Servlet?

1 Answers1