Skip to main content

Posts

Showing posts with the label javascript

Create a simple Delivery Calculator

 Assalamualaikum, As previous post , i mentioned that i wanted to create a simple distance calculator for own usage. Of course i didn't do it by myself. I watched this tutorial and download the code to start coding.  And obviously i need to customize and do a little tweaks to get the result that i wanted. Plus i apply the code into Wordpress framework by extending the Child Theme What i did was, i separate the JS function from the html code. Adding the JS script and enqueued it. Steps.  Introduce JS script,  sudo vim assets/js/calculate_distance.js   script content the additional changes that i did was, adding delivery charge calculation for the front end, i create a page template that later loaded in Wordpress page, checkout my previous post the page template content the changes that i made is on the Google Places API key value, include new labels that displays the result after the user submit the form / click "Calculate" button, preset the input value for...

Using Regular Expression / Regex In Javascript!

Writing a simple function to extract matched strings using Regex in Javascript Today i want to show how to extract string data using Regular Expression in Javascript. A regular expression is an object that describes a pattern of characters. Syntax for javascript : / pattern / modifiers ; First we can create a simple function that will process the string extraction. example of string input will be something like this <p>This is just a simple example input string</p> (     [message] => "Hello",     [desc] => "its a handshake hello!" ) <p>The purpose is to extract message and desc pattern matching</p> Simple function that will process the string extraction function extract(stringInput) { var regexp = /\[(message|desc)\](.*)/gm; var arr = []; while (result = regexp.exec(stringInput)) { arr.push(result[0]); } return arr; } The ' extract ' function will look for a pattern on anything that has opening bracket with the matching ...

The right way to load Javascript and CSS files in Wordpress.

The way we load Javascript and CSS files in Wordpress is different from the normal HTML way. First of all, we need to identify where do we want to load the scripts. Is it in our theme or plugin?. Lets say we want to load it to  our theme, we can easily create a new folder in our child theme and place the scripts in it. for example Then we can load it in our child theme functions.php file. Ok when we load, we need to understand the parameters that we want to pass in... for wp_enqueue_styles is quite straight forward. but for wp_enqueue_script.. Pay attention on deps parameter. whether the script that we want to load has dependencies with other scripts / jquery. Same goes to in_footer parameter, do we want to load in header or before the body closing tag. If we do not define properly. Our scripts might not be loaded properly. Pay attention on those two parameters.

How to easily parse PHP array to Javascript Array

Hi All, how are you doing? Stucked? Haa. Today i'm going to share with you how to easily parse a PHP array to Javascript array! Let's say we have a php array with key pair values defined. Example We want to change it to javascript object. first we will need to parse the array to json format Then we can use in javascript, either tru api or directly Same goes if we have an array of objects in PHP example Then we parse to json And access it in Javascript Hope this helps! Please leave some comment so that i can help it out~