最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Placeholder text for ajax loaded conditional fields in the registration form

programmeradmin1浏览0评论

i am using the following provided from @maruti-mohanty Link to the post
It is functioning very well the fields have placeholders, but i got conditional fields (ajax loaded) which when they appear dont have the placeholder text in them. Can i add something to the functions.php so that conditional fields also can have the placeholders ?

First you need to create a js file. I created it in my active theme's js folder and named it custom.js

then added the below line in this file.

/**
 * Custom js file.
 */

jQuery(document).ready(function(){
    jQuery('#user_login').attr('placeholder', 'User Name');
    jQuery('#user_email').attr('placeholder', 'User Email');
    jQuery('#user_pass').attr('placeholder', 'User Password');
});

The above adds place holder as User Name, User Email and User Password to the user_login, user_email, and user_pass input field respectively. You can change those as per your requirement.

Now you need to add/enqueue this js file which you can do by adding the below code in your active theme's functions.php

add_action( 'login_enqueue_scripts', 'wpse_login_enqueue_scripts', 10 );
function wpse_login_enqueue_scripts() {
    wp_enqueue_script( 'custom.js', get_template_directory_uri() . '/js/custom.js', array( 'jquery' ), 1.0 );
}

i am using the following provided from @maruti-mohanty Link to the post
It is functioning very well the fields have placeholders, but i got conditional fields (ajax loaded) which when they appear dont have the placeholder text in them. Can i add something to the functions.php so that conditional fields also can have the placeholders ?

First you need to create a js file. I created it in my active theme's js folder and named it custom.js

then added the below line in this file.

/**
 * Custom js file.
 */

jQuery(document).ready(function(){
    jQuery('#user_login').attr('placeholder', 'User Name');
    jQuery('#user_email').attr('placeholder', 'User Email');
    jQuery('#user_pass').attr('placeholder', 'User Password');
});

The above adds place holder as User Name, User Email and User Password to the user_login, user_email, and user_pass input field respectively. You can change those as per your requirement.

Now you need to add/enqueue this js file which you can do by adding the below code in your active theme's functions.php

add_action( 'login_enqueue_scripts', 'wpse_login_enqueue_scripts', 10 );
function wpse_login_enqueue_scripts() {
    wp_enqueue_script( 'custom.js', get_template_directory_uri() . '/js/custom.js', array( 'jquery' ), 1.0 );
}
Share Improve this question asked Apr 24, 2020 at 21:33 tred1975tred1975 1 3
  • Use this approach: codex.wordpress/Function_Reference/wp_localize_script – shanebp Commented Apr 24, 2020 at 22:11
  • How are you loading conditional fields? If it's custom, can't you just add the placeholders to the HTML? – Jacob Peattie Commented Apr 25, 2020 at 4:22
  • @Jacob Peattie i am not an expert but they are ajax loaded please see a screenshot: Screenshot – tred1975 Commented Apr 25, 2020 at 8:03
Add a comment  | 

1 Answer 1

Reset to default 0

Yes you can add placeholder value after the AJAX is completed and is showing some conditional field.

You can write these code in your custom.js file.

jQuery(document).ajaxComplete(function(){
    jQuery('#user_login').attr('placeholder', 'User Name');
    jQuery('#user_email').attr('placeholder', 'User Email');
    jQuery('#user_pass').attr('placeholder', 'User Password');
});

You can mention the field id and then mention the placeholder text. Basically these set of code will be executed when the ajax has completed and hence it will add the placeholder text to field those are coming from AJAX.

发布评论

评论列表(0)

  1. 暂无评论