jQuery UI Widgets Forums Plugins Validator, Drag & Drop, Sortable jqxValidator rule: how set message with language selected?

This topic contains 1 reply, has 1 voice, and was last updated by  shardik 3 weeks, 4 days ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author

  • shardik
    Participant

    In this sample:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta name="keywords" content="jqxValidator, jQuery Validation, jQWidgets, Default Functionality" />
        <title id='Description'>This demo demonstrates the Label hints of jqxValidator.</title>
        <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />	
        <script type="text/javascript" src="../../../scripts/jquery-1.12.4.min.js"></script>   
        <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
        <script type="text/javascript" src="../../../jqwidgets/jqxexpander.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxvalidator.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxcheckbox.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/globalization/globalize.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxcalendar.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxdatetimeinput.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxmaskedinput.js"></script> 
        <script type="text/javascript" src="../../../jqwidgets/jqxinput.js"></script> 
        <script type="text/javascript" src="../../../scripts/demos.js"></script> 
        <script type="text/javascript">
            $(document).ready(function () {
                $("#register").jqxExpander({ toggleMode: 'none', width: '320px', showArrow: false });
                $('#sendButton').jqxButton({ width: 60, height: 30 });
    
                $('#sendButton').on('click', function () {
                    $('#testForm').jqxValidator('validate');
                });
    
                $('.text-input').jqxInput({ width:250, height:30 });
    
                // initialize validator.
                $('#testForm').jqxValidator({
    				hintType: "label",
                    rules: [
                           { input: '#userInput', message: 'Username is required!', action: 'keyup, blur', rule: 'required' },
                           { input: '#userInput', message: 'Your username must be between 3 and 12 characters!', action: 'keyup, blur', rule: 'length=3,12' }
                           ]
                });
            });
        </script>
        <style type="text/css">
            .text-input
            {
                height: 30px;
                width: 250px;
            }
            .register-table
            {
                margin-top: 10px;
                margin-bottom: 10px;
            }
            .register-table td, 
            .register-table tr
            {
                margin: 0px;
                padding: 5px;
                border-spacing: 0px;
                border-collapse: collapse;
                font-family: Verdana;
                font-size: 12px;
            }
            h3 
            {
                display: inline-block;
                margin: 0px;
            }
        </style>
    </head>
    <body class='default'>
        <div id="register">
            <div><h3>Register</h3></div>
            <div>
                <form id="testForm" action="./">
                    <table class="register-table">
    	                
    				<tr>
    				
    						<td><input placeholder="User name" type="text" id="userInput" class="text-input" /></td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: center;"><input type="button" value="Send" id="sendButton" /></td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>
    
    </body>
    </html>

    how is possible change the message’s rule (for each rules) from ‘message default!’ to ‘message in another language!’ without page reload ?

    S


    shardik
    Participant

    solved!

    var jsonRules = $('#testForm').jqxValidator('rules');
        for (var i = 0; i < jsonRules.length; i++) {
            var message = [new message from a key]
            jsonRules[i].message = message;
        }
        $('#testForm').jqxValidator('rules', jsonRules);
    
    
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.