Java Hit: Javascript

Showing posts with label Javascript. Show all posts

Tuesday, April 30, 2019

angular proxy config json not redirected to spring

we may face this error, when we try to hit from angular UI to back end java(Spring etc.,). The problem is with angular proxy conf json file.

The configuration (Sample )should be ,

{
  "/api": {
    "target": "http://url.com",
    "secure": false,

"changeOrigin": true,
"pathRewrite": {"^/api" : ""}
}
}

Here, "changeOrigin": true, is not mandatory if you are running in local host. means, both Cline and server both are running in same machine. But if it is different host, then changeOrigin is must. However we should need this at final production. So better set now itself.

Thursday, February 22, 2018

Check Date within Date Range

Here the way you can compare one date between two dates in java script.

Date format here is like YYYY-MMM-DD (2015-Sep-12)

if(dateCheck("2012-Sep-12","2017-Jan-14","2012-Sep-11"))
    alert("Ok Match");
else
    alert("Not Match");

function dateCheck(from,to,check) {

    var fDate,lDate,cDate;
    
    fDate = Date.parse(from);
    lDate = Date.parse(to);
    cDate = Date.parse(check);
    
    if((cDate <= lDate && cDate >= fDate)) {
        return true;
    }
    return false;
}

The below one if you have different time format you Date constructor and achieve the above task.
Date format is like YYYY-MM-DD (2018-01-30). And remember for month you should subtract it from one. I mean month-1. Since month starting from number 0.

var parts1 = from.split('-');
    var parts2 = to.split('-');
    var parts3 = check.split('-');
    
    fDate = new Date(parts1[0], parts1[1] - 1, parts1[2]); 
    lDate = new Date(parts2[0], parts2[1] - 1, parts2[2]); 
    cDate = new Date(parts3[0], parts3[1] - 1, parts3[2]);

 console.log("From Date " + fDate.toDateString());
    console.log("Last Date " + lDate.toDateString());
    console.log("Check Date " + cDate.toDateString());

Wednesday, December 13, 2017

Some basic JavaScript String concepts

Basic and Best things to know work with JavaScript Strings:

1. String replace

The replace function will help to replace any string operation. It will replace string for the first occurrence only.

So by going with regex its so simple and your quality of code will be good.

let first = " I want to replace first as second , but here first comes in many places";

first.replace(/first/g,"second")

" I want to replace second as second , but here second comes in many places"

2. Template String

In ES6, we have an option to use template string which will give an option to modify the string within it. Example below.

let templateSecond = "I am waiting for you!"
`Hi Monisha ${templateSecond}`
"Hi Monisha I am waiting for you!"

3. Includes

If you want to find whether particular string is available or not in the current string. Use like below

let includeChck ="ABC, DEF, GHI, JKL, MNO"
includeChck.includes("GHI") //Output : true

includeChck.includes("GHIS") //Output : false

4. String to Number

let strToNum = "1234576"
parseInt(strToNum) // Output: 1234576

let str = "123488bcd34"
parseInt(str)    //Output: 123488

Remember if character placed after number it will not consider.

The same thing can apply to parseFloat also.

5. setInterval and setTimeout

While passing function to setInterval and setTimeout do not use string quotes. Use without quotes, so that it can bring better performance.

Else eval function will be executed it makes process time to slow.

//Wrong Format
setInterval('doSomethingPeriodically()', 1000);  
setTimeout('doSomethingAfterFiveSeconds()', 5000);


//Correct Format
setInterval(doSomethingPeriodically, 1000);  
setTimeout(doSomethingAfterFiveSeconds, 5000);

Friday, July 21, 2017

Editable and searchable Drop down with Javascript

Below is the select drop down, here you able to Edit, Search and Select the value. But forgot to implement arrow icon for the drop down.

However I will do another post which will show you how to hide and show drop down arrow image with the help of css.

Comment below if you need any query.

<html>
<head>
<title>Own Drop Down Component</title>

</head>
<body>
<form name="myfrm">
<input id="filter">
<select id="countries" multiple onchange="onChangeValue()" style="width:11%">
  <option value="india">India</option>
  <option value="america">America</option>
  <option value="germany">Germany</option>
  <option value="russia">Russia</option>
</select>
</form>
<script type="text/javascript">
(function () {
    // the IIFE  for local variable store information
    var optionsCache = [];

    // add option values to the cache with reduce
    function optionsArray(select) {
        var reduce = Array.prototype.reduce;
  //addToCache for cache
        return reduce.call(select.options, function addToCache(options, option) {
            options.push(option);
            return options;
        }, []);
    }
    // give a list of options matching the filter value with match function
    function filterOptions(filterValue, optionsCache) {
        return optionsCache.reduce(function filterCache(options, option) {
            var optionText = option.textContent;
            if (option.text.toLowerCase().match(filterValue.toLowerCase())) {
                options.push(option);
            }
            return options;
        }, []);
    }
    // replace current with new options
    function replaceOptions(select, options) {
 //document.getElementById("countries").size = select.options.length;
        while (select.options.length > 0) {
            select.remove(0);
        }
        options.forEach(function addOption(option) {
            select.add(option);
        });
    }
    
    function filterOptionsHandler(evt) {
        var filterField = evt.target;
        var targetSelect = document.getElementById("countries");
        if (optionsCache.length < 1) {
            optionsCache = optionsArray(targetSelect);
        }
        var options = filterOptions(filterField.value, optionsCache);
        replaceOptions(targetSelect, options);
  var x = document.getElementById("countries").length;
  //alert("bbb"+x)
  if (x > 0) {
  document.getElementById("countries").size = x;
  } else {
   document.getElementById("countries").size = 1;
   var select = document.getElementById("countries");
   select.options[select.options.length] = new Option('No Results','empty');}

    }
    // attach whatever event
    var filter = document.getElementById("filter");
 
    filter.addEventListener( 'click', function(){
  document.getElementById("countries").style.display = "block";
 } );
 filter.addEventListener("keyup", filterOptionsHandler, false);
 document.getElementById("countries").style.display = "none";
}());

function onChangeValue () {
var e = document.getElementById("countries");
var strUser = e.options[e.selectedIndex].text;
//alert(strUser);
  
  if (strUser != null) {
    //alert("Test" + strUser);
 document.getElementById('filter').value = strUser;
 document.getElementById("countries").style.display = "none";
  }
 }
  
</script>
</body>
</html>