wordpress telephone javascript validation and replace field value with cleaned number

My objective is the contact form 7, telephone number:

step 1: min 10 digits

step 2: remove spaces

step 3: remove country code +91, 091, 0091 Only if the total number is above 10

step 4: show invalid number if the cleaned number is wrong

step 5: In the tel input field, replace the final clean number with user entered number

I can write the coding for step 1 to step 4, but for step 5, I am not sure in wordpress which function or parameters to replace the text field?

even I came across $result->invalidate( $tag, "Please enter a valid number." ); but failed in replacing the text field

for step 1 to step 4 used below function, and made $result=false; if wrong format after clean up the numbers

function custom_filter_wpcf7_is_tel( $result, $tel ) {

    $accepted = array("7", "8", "9");



    -- codes here  $result = true;  OR  $result = false; --



    return $result;

}

add_filter( 'wpcf7_is_tel', 'custom_filter_wpcf7_is_tel', 10, 2 );

For step 5, I was trying this, but failed to implement step 5.

add_action( 'wp_footer', 'mycustom_wp_footer' );



function mycustom_wp_footer() 

{

?>



<script type="text/javascript">

document.addEventListener( 'wpcf7submit', function( event ) {

    var inputs = event.detail.inputs;



    for ( var i = 0; i < inputs.length; i++ ) {

        if ( 'your-tel' == inputs[i].name ) {

            alert( inputs[i].value );



            -- tried many experiments here --



            break;

        }

    }

}, false );

</script>

}

eg:

+919192345678 display in text field 9192345678

+91 91923 45678 display in text field 9192345678

+9191923456780 show error message bcaz cleaned number is 11 digits

EXAMPLE:

enter image description here

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

add a comment |

My objective is the contact form 7, telephone number:

step 1: min 10 digits

step 2: remove spaces

step 3: remove country code +91, 091, 0091 Only if the total number is above 10

step 4: show invalid number if the cleaned number is wrong

step 5: In the tel input field, replace the final clean number with user entered number

I can write the coding for step 1 to step 4, but for step 5, I am not sure in wordpress which function or parameters to replace the text field?

even I came across $result->invalidate( $tag, "Please enter a valid number." ); but failed in replacing the text field

for step 1 to step 4 used below function, and made $result=false; if wrong format after clean up the numbers

function custom_filter_wpcf7_is_tel( $result, $tel ) {

    $accepted = array("7", "8", "9");



    -- codes here  $result = true;  OR  $result = false; --



    return $result;

}

add_filter( 'wpcf7_is_tel', 'custom_filter_wpcf7_is_tel', 10, 2 );

For step 5, I was trying this, but failed to implement step 5.

add_action( 'wp_footer', 'mycustom_wp_footer' );



function mycustom_wp_footer() 

{

?>



<script type="text/javascript">

document.addEventListener( 'wpcf7submit', function( event ) {

    var inputs = event.detail.inputs;



    for ( var i = 0; i < inputs.length; i++ ) {

        if ( 'your-tel' == inputs[i].name ) {

            alert( inputs[i].value );



            -- tried many experiments here --



            break;

        }

    }

}, false );

</script>

}

eg:

+919192345678 display in text field 9192345678

+91 91923 45678 display in text field 9192345678

+9191923456780 show error message bcaz cleaned number is 11 digits

EXAMPLE:

enter image description here

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

add a comment |

My objective is the contact form 7, telephone number:

step 1: min 10 digits

step 2: remove spaces

step 3: remove country code +91, 091, 0091 Only if the total number is above 10

step 4: show invalid number if the cleaned number is wrong

step 5: In the tel input field, replace the final clean number with user entered number

I can write the coding for step 1 to step 4, but for step 5, I am not sure in wordpress which function or parameters to replace the text field?

even I came across $result->invalidate( $tag, "Please enter a valid number." ); but failed in replacing the text field

for step 1 to step 4 used below function, and made $result=false; if wrong format after clean up the numbers

function custom_filter_wpcf7_is_tel( $result, $tel ) {

    $accepted = array("7", "8", "9");



    -- codes here  $result = true;  OR  $result = false; --



    return $result;

}

add_filter( 'wpcf7_is_tel', 'custom_filter_wpcf7_is_tel', 10, 2 );

For step 5, I was trying this, but failed to implement step 5.

add_action( 'wp_footer', 'mycustom_wp_footer' );



function mycustom_wp_footer() 

{

?>



<script type="text/javascript">

document.addEventListener( 'wpcf7submit', function( event ) {

    var inputs = event.detail.inputs;



    for ( var i = 0; i < inputs.length; i++ ) {

        if ( 'your-tel' == inputs[i].name ) {

            alert( inputs[i].value );



            -- tried many experiments here --



            break;

        }

    }

}, false );

</script>

}

eg:

+919192345678 display in text field 9192345678

+91 91923 45678 display in text field 9192345678

+9191923456780 show error message bcaz cleaned number is 11 digits

EXAMPLE:

enter image description here

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

My objective is the contact form 7, telephone number:

step 1: min 10 digits

step 2: remove spaces

step 3: remove country code +91, 091, 0091 Only if the total number is above 10

step 4: show invalid number if the cleaned number is wrong

step 5: In the tel input field, replace the final clean number with user entered number

I can write the coding for step 1 to step 4, but for step 5, I am not sure in wordpress which function or parameters to replace the text field?

even I came across $result->invalidate( $tag, "Please enter a valid number." ); but failed in replacing the text field

for step 1 to step 4 used below function, and made $result=false; if wrong format after clean up the numbers

function custom_filter_wpcf7_is_tel( $result, $tel ) {

    $accepted = array("7", "8", "9");



    -- codes here  $result = true;  OR  $result = false; --



    return $result;

}

add_filter( 'wpcf7_is_tel', 'custom_filter_wpcf7_is_tel', 10, 2 );

For step 5, I was trying this, but failed to implement step 5.

add_action( 'wp_footer', 'mycustom_wp_footer' );



function mycustom_wp_footer() 

{

?>



<script type="text/javascript">

document.addEventListener( 'wpcf7submit', function( event ) {

    var inputs = event.detail.inputs;



    for ( var i = 0; i < inputs.length; i++ ) {

        if ( 'your-tel' == inputs[i].name ) {

            alert( inputs[i].value );



            -- tried many experiments here --



            break;

        }

    }

}, false );

</script>

}

eg:

+919192345678 display in text field 9192345678

+91 91923 45678 display in text field 9192345678

+9191923456780 show error message bcaz cleaned number is 11 digits

EXAMPLE:

enter image description here

wordpress contact-form-7

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

edited Nov 22 '18 at 9:10

asked Nov 22 '18 at 8:46

J.K

1,2191725

asked Nov 22 '18 at 8:46

J.K

1,2191725

asked Nov 22 '18 at 8:46

J.K

1,2191725

add a comment |

0

active

oldest

votes

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53426946%2fwordpress-telephone-javascript-validation-and-replace-field-value-with-cleaned-n%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

0

active

oldest

votes

0

active

oldest

votes

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Wsrtjtyk