[{"category":"wordpress","keyworld":"ajax-wordpress-hook","title":"How send data trhought ajax in wordpress","html":"

All the modern websites can do all things without refresh the web page, we all know PHP is a server side render so this do the web site refresh when do a action.

send a form, display more post, do that website refresh, but we can do a lot of stuff whitout refresh implementing Ajax to execute actions like save data in database, send emails, ect...

A file js send data throught POST after a function php receive data that confirm all actions using json encode to be interpreted for the file js.

This action not refresh the webpage, so implement Ajax is one feature very important for made your WordPress more smart and natural.

let get start with the steps...

First we need to import the file so Ajax send the info information, this file has the function so return an info transformed in json, then can be read the javascript file.

1. first step is include php file that contain the function with the response in json format.

require_once plugin_dir_path(__FILE__) . '../admin/outputBackend.php';

2.the second step is to call the file javascript for send info thought Ajax, using the hook WordPress that do that

function admin_sript() {

wp_enqueue_script( 'backendScript', plugins_url( '../src/clt_script.js', __FILE__ ), array(), '1.0.0', true );

}

add_action('admin_enqueue_scripts', 'admin_sript');

3. The third step is send through (find script hook) the ajax parameter to connect both files. You can, at this moment, send a lot of important info like parameter

function clt_admin_sript() {

wp_enqueue_script( 'backendScript', plugins_url( '../src/clt_script.js', __FILE__ ), array(), '1.0.0', true );

wp_localize_script( 'backendScript', 'ajax_var', array(

'ajax_url' => admin_url( 'admin-ajax.php' ),

'nonce' => wp_create_nonce( 'my-ajax-nonce' )

));

}

add_action('admin_enqueue_scripts', 'clt_admin_sript');

4. In the four step Now WordPress need to know how to connect these JavaScript file with the function php then we need to use another hook named -wp_ajax_nopriv- and -wp_ajax- for use this like user logued or not

add_action( 'wp_ajax_nopriv_saveStripekeys', 'ouputStripeOptions' );

add_action( 'wp_ajax_saveStripekeys', 'ouputStripeOptions' );

Now you are ready for send info through Ajax. Without that connections, you can't do the process. But now you need how work the file JavaScript and get any idea for use the file php.

In another article, I explain how to send files like images, or plain text for example send a email.

","friendlyUrl":"Implement-ajax-in-wordpress","image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2FajaxWordpress.jpeg?alt=media&token=f0b603a2-304d-4826-b5f9-37b5ed63594c","date":{"seconds":1643548073,"nanoseconds":68000000},"lang":"en","imageAlt":"ricardo perez wordpress"},{"keyworld":"replaceAll-javascript-node","html":"

Some features of ecma Script seems not work like us spected and a great feature and grateful is the function replaceAll, this can replace all piece found in a string

This happens because your browser or version of node is not compatible with this feature then result in a error saying replaceAll is not a function, but while we wait the solution, we can use a regular expression with the function replace then this can work similar to replaceAll function

let string = 'loremp-its-our-lorm-flext'

let regExp = /-/g

let replaceString = replace(regExp, ' ')

// result = loremp its our lorm flext

This is a simple solution to fix the problem, I hope in the future this feature work without show a error.

","friendlyUrl":"fix-error-replaceAll-is-not-a-function","category":"javascript","date":{"seconds":1638225555,"nanoseconds":367000000},"image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2Fselectall.jpeg?alt=media&token=8cbf4600-659e-4167-9403-3dc8623d88ff","imageAlt":"save vs dev redes ricardo lavour","title":"how fix error replaceAll of javascript, and in specific in react or node app, have a simple solution using href flag","lang":"en"},{"category":"Productivity","keyworld":"job search-spain-developers","imageAlt":"","html":"

This article if for people with search jobs from outside span, and my own experience search jobs inside and how to get a work only on fitting days like a web developer.

The first point to advice, I was never see anything business search talent outside Spain, maybe is too difficult bureaucratic process, or if search talent outside, this talent is highly difficult get inside like scientific or specialist ect.

For the moment, only refer to explain the best way to get work like web developer, and how you need to get an opportunity in this town.

Try to imaging a vacancy, like junior web developer or junior in digital media marketing, and you're a person with search a job with this profile. Is sure or maybe impossible to get a job in this situation, and a lot of people try to get an opportunity in this case.

But not surrender, if you know some info and you have the knowledge about how thinks the profile searcher.

1. Focus in do specific in your cv: Maybe you have a lot of knowledge or experience and different talent, but the talent hunting not require know all, then if you searchjob like marketing only put info in your cv referent a this role.

2. Design a simple cv: Not use different color and image, think that your CV gonna be print, then if you use
graphic and color maybe your CV is not selected, focus in put only text and an font normal like Arial or times, your experiences and skill is the more important and not the design.

3. Your Pic or Personal data: Is not necessary put your pic or info like is you be married or your address or ID, This info is set in a interview and not all in necessary respond, a talent searcher that select a profile for the your pic or nationality is not a great searcher then not matter if not get this job.

4. Cover letter: Some business demand this, but is not mandatory. If you feel good doing that then do a great cover letter, a cover letter is not a bad idea and can be the difference if you decide do. In here, try to explain your future plan and how you are like a person and your compromise in the company if get the opportunity to join at them.

This is what a resume looks like

This is a simple CV and focus in skills, experience and study, a talent searcher can see a great info important where can determine a good profile only in a quick see

I'm sure all know that all career need constantly getting new knowledge so, if you come from outside, think that that you need to show your better potential, and do a great competitive profile, something like talk in English, extra studies, can give you better opportunity to get this work so the point is made your best efforts make a great profile and this is key to get a great job in this town.

The best tools to get a job in Spain is use the best apps most useful for talent searchers, here is a list of most used:

No all is great, if you need to know my something bad experience, let me a comment, and personally we can talk about how is the bad when try to get a job here.

I hope this info can help to improve your plan to get a job opportunity here.

","friendlyUrl":"how-get-work-in-spain","date":{"seconds":1636917220,"nanoseconds":471000000},"lang":"en","image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2FgetWork.jpeg?alt=media&token=b6fed2c7-ff1f-415a-b42a-a4e3c2a9e57c","title":"Get work fast in spain is not the same for all careers, in my case developers is hight demanded profiles for talent searchers"},{"image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2FhttpRequest.jpeg?alt=media&token=f36e9e97-0f79-42f1-b581-b15984c6aac6","date":{"seconds":1636498740,"nanoseconds":303000000},"lang":"en","keyworld":"XMLRequest-fomr-ajax","friendlyUrl":"when-use-headers-for-binary-files-or-text-plain","imageAlt":"esl_lint ricardo perez","title":"How decide which kind of header use if send plain text or binary files using XMLRequest in javascript?, and this whit only a code line","html":"

In a form not all time, we send not only plain text, then is helpfully know which kind of header sent to own request form, because is not the same send text plain, than binary files,

When we send text plain, need say to url of destiny what kind of data we will send.

Here is a example when send plain text, follow these rules. Data must be sent like key=data joing with & symbol then the data travel like this example \"name=jon&pasword=123456&remember=true\" .

On this occasion we need to use a specific header like this:

xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')

But what happen when we need to send another type of data or in specific data how contain binary files like a PDF or image files. The good news is that ajax use by default headers to receive that kind of data, then in my opinion is not mandatory to include header if we gonna send binary files, for this motive, using a lineal conditional can solve this problem if use different forms to sending the same file ajax to send that information.

dataForm === 'plain' ?

xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')

: null

With this simple solution we save time and work perfectly, because I spend at less 2 hour find solutions to select how use different kind of header if have different form to send info.

That is all, hope this title info can help someone coders.

","category":"javascript"},{"keyworld":"cookies- javascript-javascript array","friendlyUrl":"get-a-especific-cookie","imageAlt":"404 redponse ricardo perez","image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2Fcookies.jpeg?alt=media&token=e2253b29-2824-4fcf-9abe-c03042eb9af4","title":"How get a especific cookie in a list, using javascript","html":"

we might talk about how set a cookie or set a time for this cookie, also diferent way to delette this cookie but in this short post only goes to explain how get a especific cookie if wknown the name of same, using a simple function.

to init we need set a function, this recive a paramether with the name of the cookie.

whit this code, we get all cookie set in the browser

const allCookies = document.cookie;

whit this code, we get all cookie set in the browser, whit this you can get all separate by \";\"

Now whit the function .split we get a array of all cookies

const spl = allCookies.split(';')

Set a empty array to get the especific query when filter to found the cookie we need

let cookies = []

Now travel in all items then split for get key and value after fill the empty variable con el item selected

for(var p = 0; p < spl.length; p++){

const key = spl[p].split(\"=\")

key[0] === find ? cookies.push(spl[p]):null;

puede devolver una matriz con el valor encontrado o devolver un mensaje que diga que no se ha encontrado la cookie

if(cookies.length > 0){

return cookies

}else{

return `no cookies found`

This is the complete function for get the result

If you need more info, please comment.

","date":{"seconds":1634227143,"nanoseconds":50000000},"lang":"en","category":"javascript"},{"category":"javascript","imageAlt":"Get a list of cookies","html":"

Make your website friendly to user, is the best idea you can implement, think not all user can do a simple copy and paste if you show a url maybe to set a url to download a pdf-image or anythink.

some where in the website we can copy an short text, not all time result easy, example, can't select exacly text or try to copy whit wrong keycap and another situations can do struggle this simple action.

More recomendly is set a button do this for us, then put in this wathever we want, link to url, link to download, link to share post.

let get started to explain how do that.

the more simple way to do that is use this code

navigator.clipboard.writeText(data).then(
function () {
console.info('clipboard was successful!')
},
function (err) {
console.error('Async: Could not copy text: ', err)
}
)

Only access to navigator.clipboard.writeText() you can copy the content to clipboard. but this function is block for navigators por security topics. now is time to do that of other way

* First we need create a dom element tipe imput like this

const inputElem = document.createElement('input')

Many people can see this step is not necesary becayse this function is higly fast and user will not can see this element show in the dom but is better take care to no show this element if the machine run slow, but if you do that this input is type hidden and is not show in the dom

inputElem.setAttribute(\"type\", \"hidden\")

Now fill this input whit your info

inputElem.value = data

Set this element in the dom, or wathever place yow want place this

document.body.appendChild(inputElem)

Focus and select the element

inputElem.focus()
inputElem.select()

Now go to made a try and catch function to get the abability the catch a error if someone bad result

try {
const great = document.execCommand('copy')
const output = great ? 'successful' : 'unsuccessful'
console.log('Fallback: Copying text command was ' + output)
} catch (err) {
console.error('Fallback: Oops, unable to copy', err)
}

if all is ok, now we need errase this element of dom

document.body.removeChild(inputElem)

I recomend go for the second option because is very stranger if found a navigator than not block the acces to clipboard

","date":{"seconds":1622826388,"nanoseconds":0},"lang":"en","friendlyUrl":"auto-copy-in-a-click","image":"https://firebasestorage.googleapis.com/v0/b/logoteca-864c2.appspot.com/o/all%2Fcrlr_C.jpeg?alt=media&token=c4917503-2927-42bd-ac62-eea2b82663c3","title":"Set acces to your clients to do on a simple click to copy information in your clipboard","keyworld":"test"}]

How send data trhought ajax in wordpress

how fix error replaceAll of javascript, and in specific in react or node app, have a simple sol...

Get work fast in spain is not the same for all careers, in my case developers is hight demanded...

​How decide which kind of header use if send plain text or binary files using XMLRequest in jav...

How get a especific cookie in a list, using javascript

Set acces to your clients to do on a simple click to copy information in your clipboard

How decide which kind of header use if send plain text or binary files using XMLRequest in jav...