JavaScript

$(document).on("change", "#Shipper_VendorID", function () {
        load_rateAPICodes();
    });

    $(document).on("change", "#Shipper_RateAPICode", function () {
        load_RateAPIDetails();
    });

beforeSend: function () {
  // Unbind Events if the Vendor has changed            
  $(document).off("change", $ddl_vendorID);
  $(document).off("change", $ddl_serviceID);            
},

complete: function () {
  // Rebind the Events that were unbinded if the vendor was changed            
  $(document).on("change", $ddl_vendorID, load_rateAPICodes());
  $(document).on("change", $ddl_serviceID, load_RateAPIDetails());                        
}

function run_packageSelect(_packageID) {

    var $txt_orderID                    = $("#Order_ID"),<br />
        $ddl_vendorID                   = $("#Shipper_VendorID"),
        $ddl_serviceID                  = $("#Shipper_RateAPICode"),
        $js_packageAdd                  = $("#js_packageAdd"),
        _dataVendorID                   = $("#Shipper_VendorID option:selected").attr("value"),
        _dataVendorAttr                 = $ddl_serviceID.attr("data-vendor");

    // Collapse the Package Form
    $js_packageAdd.collapse('hide');

    $.ajax({
        type: "POST",
        cache: true,
        dataType: "json",
        global: true,
        url: '/Ajax/Json_Shipment_Order_Package_Fetch',
        data: { Package_ID: parseInt(_packageID, 10) },
        beforeSend: function () {
            // Unbind Events if the Vendor has changed<br />
            $(document).off("change", $ddl_vendorID);
            $(document).off("change", $ddl_serviceID);<br />
        },
        error: function (response) {<br />
            alert("http code: " + response.status + " Error: Json_Shipment_Order_Package_Fetch - data: " + response);
        },
        success: function (data) {

            // Update the Dropdown boxes if the vendor has changed
            $ddl_vendorID.val(data.Vendor_ID); 
            if (parseInt(_dataVendorID, 10) !== parseInt(_dataVendorAttr, 10)) {

                $.ajax({
                    type: "POST",
                    cache: true,
                    dataType: "json",
                    url: '/Ajax/Json_Shipment_Load_Vendor_Services',
                    global: true,
                    data: { ShipperID: parseInt(data.Vendor_ID, 10) },
                    error: function (response) {
                        alert("http code: " + response.status + " Error: Json_Order_Shipment_Load_Services - data: " + response);
                    },
                    success: function (data) {
                        var markup = "<option value=''> " + data.length + " services(s) found --</option>";
                        for (var x = 0; x < data.length; x++) {
                            if (data.Value == data.Service_ID) {
                                markup += "<option value=" + data[x].Value + " selected>" + data[x].Text + "</option>";
                            }
                            else {
                                markup += "<option value=" + data[x].Value + ">" + data[x].Text + "</option>";
                            }
                        }
                        $("#Shipper_RateAPICode").html(markup).show();
                    },
                    complete: function () {
                        $ddl_serviceID.val(data.Service_ID).change();
                    }
                });
            }
            else {
                $ddl_serviceID.val(data.Service_ID).change();
            }
        },
        complete: function () {
            // Rebind the Events that were unbinded if the vendor was changed<br />
            $(document).on("change", $ddl_vendorID, load_rateAPICodes());
            $(document).on("change", $ddl_serviceID, load_RateAPIDetails());<br />
        }
    });
}

<% if (typeof success !== "undefined") { %>
    //this works fine and the h4 only shows up if the if statement is true
     <h4><%= success %></h4>

<% } %>

<% if (typeof success !== "undefined") { %>
//this div is showing up regardless when adding the //bootstrap classes
        <div class="alert alert-success"><%= success %></div>
    <% } %>

const express = require('express');
const path = require('path');
const favicon = require('serve-favicon');
const logger = require('morgan');
const cookieParser = require('cookie-parser');
const session      = require('express-session');
const bodyParser = require('body-parser');
const port       = 5000;
const mongoose = require('mongoose');
const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;
const flash = require('connect-flash');
const engine = require('ejs-mate');

const app = express();

app.use(logger('dev'));
app.use(bodyParser.json() );
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
// view engine setup
app.engine('ejs', engine);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));

app.use(session({
  secret: 'keyboard cat',
  resave: false,
  saveUninitialized: true
}));
app.use(flash());
app.use(function(req, res, next) {
  res.locals.currentUser = req.user;
    res.locals.error = req.flash("error");
    res.locals.success = req.flash("success");
    next();
});
//routes
const indexes = require('./routes/indexes');
const diaries = require('./routes/diaries');
const users = require('./routes/users');



// Configure passport middleware
app.use(passport.initialize());
app.use(passport.session());

// Configure passport-local to use account model for authentication
const db = require('./models');
passport.use(new LocalStrategy(db.User.authenticate()));

passport.serializeUser(db.User.serializeUser());
passport.deserializeUser(db.User.deserializeUser());
app.use('/users', users);
app.use('/', indexes);
app.use('/diaries', diaries);


// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

app.listen(port, ()=>{
  console.log(`App started on port ${port}`);
});
module.exports = app;

<div class="container">
  <div class="row">
    <div class='col-sm-2'>
      <div class="form-group col-xs-5 col-lg-1">
        <select id="dddata">
  <option value="Text">Text</option>
  <option value="Date">Date</option>
</select>
        <div class='input-group date' id='datetimepicker1'>
          <input type='text' class="form-control" />
        </div>
      </div>
    </div>

  </div>
</div>

$(document).ready(function () 
{
	  var $htmlelement = jQuery('<span class="glyphicon glyphicon-calendar"></span>');

  SetUPUI();
  $("#dddata").change(function() {
    SetUPUI();
  });


  function SetUPUI() {
    if ($('#dddata').val() == "Date") {

      $('#datetimepicker1').append($htmlelement);
      // bind datepicker to the element
      $('#datetimepicker1').datepicker({
        autoclose: true,
        format: "mm/dd/yyyy"
      });
    } else {

      // remove the proper element
      $('#datetimepicker1 span.input-group-addon').remove();
      // call destroy (remove does not work)
      //$('#datetimepicker1').datepicker('destroy');
      $('#datetimepicker1').datepicker("option", "disabled", true);
    }
  } 
});

function setBG() {
        $("#gridId").find("tr").each(function () {
            var css = $(this).attr("class");
            if (css != null && css == "bgRow")
                $(this).addClass("norRow").removeClass("bgRow");
            else if (css != null && css == "norRow")
                $(this).addClass("bgRow").removeClass("norRow");

        });
         setTimeout("setBG()", 1000); 
    }
    
jsfiddle <a href="http://jsfiddle.net/tridip/mc2fb8ag/1/">highlight table row with css - JSFiddle</a>[<a href="http://jsfiddle.net/tridip/mc2fb8ag/1/" target="_blank" title="New Window">^</a>] 
   
setBG();

I am a novice to JavaScript and am trying to learn it out. I am struck with the automatic calculation of days and automatic insertion of month, calendar week based on the user entered data.

I searched and I got to calculate the differences only by static not by the user entered dates. Can anyone help me out here please.

I have 6 Text boxes.

In 1st textbox "Year" user enters a specific date (dd.mm.yy) 
2nd text box needs to be automatically filled with the respective calendar week 
3rd text box needs to be automatically filled with the respective month (Jan, Feb, Mar)
4th text box needs to be automatically filled with the respective year

5th text box user enters another date (dd.mm.yy)
6th text box needs to be automatically filled with the number of days difference between 2nd entered date and first entered date.

My code is as below.

$(function() { 
$( "#datepicker").datepicker({ dateFormat: 'dd.mm.yy' }); 
$("#datepickerend").datepicker({ dateFormat: 'dd.mm.yy'});
  
});
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div>
<table border="0">
<tr>
<td>Date: <input type=text name="date" id="datepicker"></td>
</tr>
<tr>
<td>CW: <input type=text name="CW"></td>
</tr>
<tr>
<td>Month: <input type=text name="Month"></td>
</tr>
<tr>
<td>Year: <input type=text name="Year"></td>
</tr>
<tr>
<td>Ending Date: <input type=text name="enddate" id="datepickerend"></td>
</tr>
<tr>
<td>Days: <input type=text name="days"></td>
</tr>
</table>
</div>