Custom Fields
Re-Envisioned
Support MB Settings Page Number field for prices

  • Creator
    Topic
  • #21214
    Resolved EricHedvat
    Participant

    Is there a way to make the number field more user friendly for entering prices. Either by autoformatting prices to add commas as the number is entered. Or by allowing user to enter the price including non numerical characters e.g $5,000,000?

    It is easy for the user to make a mistake if they need to enter large numbers without any formatting. e.g 5000000 (5M) vs 50000000 (50M).

    Thanks

Viewing 9 replies - 1 through 9 (of 9 total)
  • Author
    Replies
  • #21220
    Long Nguyen
    Moderator

    Hi Eric,

    You can use the custom sanitize callback to format the value of the field number. Please follow these documentations.
    https://docs.metabox.io/sanitization/#custom-sanitize-callback
    https://www.php.net/manual/en/function.number-format.php

    #21225
    EricHedvat
    Participant

    Thanks for the reply,

    What about displaying the formatted version after/next to the input field?

    #21230
    Long Nguyen
    Moderator

    Hi,

    The text field can help you to add the character $ and thousand separators. See my screen record https://www.loom.com/share/5734ebb11914426b8444e403d6ddb678.

    And the sample code to sanitize the field.

    function custom_sanitize_numer( $value ) {  
        // Format number, add separate comma  
        $value = number_format( (int) $value );
    
        // Add character $ before number
        if ( 0 !== strpos( $value, '$' ) ) {
            $value = '$' . $value;
        }
    
        return $value;
    }
    #21238
    Anh Tran
    Keymaster

    Hi Eric,

    FYI, there's a community plugin for adding mask to input for phone numbers or currency that you might want to check out. There are also other resources in the menu Support > Resources.

    #21903
    Jon San Roman
    Participant

    How can i display in elementor a number 1000000 like that: 1.000.000?

    #21914
    Long Nguyen
    Moderator

    Hi Jon,

    After sanitizing the field value, it is stored in the database as the formatted value (1.000.000) then you can use the extension Meta Box Elementor Integrator to show the field value (formatted) by Elementor.

    If you use an input of Elementor itself, please follow this documentation to achieve the goal https://developers.elementor.com/elementor-controls/number-control/.

    #21919
    Jon San Roman
    Participant

    Hi!

    I have solved the problem but a new problem has appeared.

    I have added this code to functions.php

    function custom_sanitize_numer( $value ) {  
        // Format number, add separate comma  
        $value = number_format(  $value, 0, ',', '.' );
    
        return $value;
    }

    Now everything looks fine in front but in the backend i am getting a bug.
    https://capturas.trinchera.marketing/04uq4Rgm

    #21922
    Long Nguyen
    Moderator

    Hi,

    The field number only accepts the raw number (not formatted) such as 100000. You should use the field text as I reply above or use a third-party plugin as Anh Tran said to show the number formatted.

    #31117
    Tobias Haas
    Participant

    How can I show a comma instead of a period for numbers (price)?

    I want the price to look like this - 1,23 €

    Thanks

Viewing 9 replies - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.