jQWidgets Forums

Tagged: jquery validator, validator

This topic contains 11 replies, has 2 voices, and was last updated by ScottNL 12 years, 10 months ago.

Viewing 12 posts - 1 through 12 (of 12 total)

Author

method 'toLowerCase' Posts
June 20, 2012 at 12:50 pm method 'toLowerCase' #5142

ScottNL
Member

Hallo there

Uncaught TypeError: Cannot call method ‘toLowerCase’ of undefined

Just trying out the validator function but keep getting this error

Heres the snippet

$(‘#manu’).jqxValidator({
rules: [
{ input: ‘#manufacturer #m__name’, message: ‘Verplicht veld’, action: ‘keyup’, rule: ‘minLength=3’ },
{ input: ‘#manufacturer #m__search_key’,message: ‘Verplicht veld’, action: ‘keyup’, rule: ‘minLength=3’ },
{ input: ‘#manufacturer #m__address1’, message: ‘Verplicht veld’, action: ‘keyup’, rule: ‘minLength=3’ },
{ input: ‘#manufacturer #m__postcode’, message: ‘Verplicht veld’, action: ‘keyup’, rule: ‘minLength=3’ },
{ input: ‘#manufacturer #m__city’, message: ‘Verplicht veld’, action: ‘keyup’, rule: ‘minLength=3’ },
],
theme: theme
});

June 20, 2012 at 1:07 pm method 'toLowerCase' #5144

Peter Stoev
Keymaster

Hi ScottNL,

I am not sure about the syntax: “‘#manufacturer #m__name’,”.

It should be something like that:

{ input: ‘#userInput’, message: ‘Username is required!’, action: ‘keyup, blur’, rule: ‘required’ },

If you want to add additional rules for the same element use such syntax:

{ 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’, rule: ‘length=3,12’ },

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

June 20, 2012 at 1:11 pm method 'toLowerCase' #5146

ScottNL
Member

It was just the selector saying to grab only #m__name within #manufacturer

But i have just renamed the fields and still getting this error:

Uncaught TypeError: Cannot call method ‘toLowerCase’ of undefined

within the Validator function

June 20, 2012 at 1:16 pm method 'toLowerCase' #5148

ScottNL
Member

Just tryed this and got the same error:

$(document).ready(function () {
$(‘#manu’).jqxValidator({
rules: [
{ input: ‘#userInput’, message: ‘Username is required!’, action: ‘keyup, blur’, rule: ‘required’ }

],
theme: theme
});
});

Naam:

June 20, 2012 at 1:21 pm method 'toLowerCase' #5150

Peter Stoev
Keymaster

Hi ScottNL,

I’m afraid that I’m not sure what may be the cause for the behavior you have described. Therefore, providing a small sample in which this can be observed locally will be appreciated.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

June 20, 2012 at 1:34 pm method 'toLowerCase' #5152

ScottNL
Member

I’ll try to post the code. But posting code on this forum is a annoying job.

June 20, 2012 at 1:42 pm method 'toLowerCase' #5155

ScottNL
Member

Is there any documentation on how to post code on the forum?

June 20, 2012 at 1:45 pm method 'toLowerCase' #5156

Peter Stoev
Keymaster

Hi ScottNL,

To post code, select the code and press the “Format HTML Code” button in the Forum’s toolbar.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

June 20, 2012 at 1:55 pm method 'toLowerCase' #5157
ScottNL
Member
```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Manufactures</title>
  <link rel="stylesheet" href="jqcore/css/ui-lightness/jquery-ui-1.8.21.custom.css" type="text/css" />
  <link rel="stylesheet" href="jqwidgets/jqwidgets/styles/jqx.base.css" type="text/css" />
  <link rel="stylesheet" href="jqwidgets/jqwidgets/styles/jqx.classic.css" type="text/css" />
  <link rel="stylesheet" href="styles/main.css" type="text/css" />
  <link rel="stylesheet" href="styles/form.css" type="text/css" />
  <script type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
  <script type="text/javascript" src="jqcore/js/jquery-ui-1.8.21.custom.min.js"></script>
  <script type="text/javascript" src="jqwidgets/scripts/gettheme.js"></script>
  <script type="text/javascript" src="jqwidgets/jqwidgets/jqx-all.js"></script>
  <script>
 $(document).ready(function () {
            var theme = 'classic';
            $('#manu').jqxValidator({
             rules: [
                    { input: '#ainput',      message: 'Verplicht veld', action: 'keyup', rule: 'minLength=3' },
                    ],
                    theme: theme
            });
  });
  </script>
</head>
<body>
    <div id="manufacturer" style="padding:15px;">
        <form id="manu">
            <table>
                <tr>
                    <td class="label" >Fabrikant code:</td>
                    <td><input id="ainput" class="text-input-small" /></td>
                </tr>
            </table>
        </form>
    </div>
</body>
</html>
```
June 20, 2012 at 1:58 pm method 'toLowerCase' #5158

ScottNL
Member

btw i feel pretty stupid now that i know it’s so easy

June 20, 2012 at 2:05 pm method 'toLowerCase' #5159
Peter Stoev
Keymaster
Hi ScottNL,

The issue is that the inputs validated with the jqxValidator should have a class – jqx-input.

For example:
```
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Manufactures</title>
  <link rel="stylesheet" href="styles/jqx.base.css" type="text/css" />
  <link rel="stylesheet" href="styles/jqx.classic.css" type="text/css" />
  
  <script type="text/javascript" src="../scripts/jquery-1.7.2.min.js"></script>
  <script type="text/javascript" src="jqxcore.js"></script>
  <script type="text/javascript" src="jqxvalidator.js"></script>
  <script>
 $(document).ready(function () {
            var theme = 'classic';
            $('#manu').jqxValidator({
             rules: [
                    { input: '#ainput',  message: 'Verplicht veld', action: 'keyup', rule: 'minLength=3' }
                    ],
                    theme: theme
            });
  });
  </script>
</head>
<body>
    <div id="manufacturer" style="padding:15px;">
        <form id="manu">
            <table>
                <tr>
                    <td class="label" >Fabrikant code:</td>
                    <td><input id="ainput" class="jqx-input text-input-small" /></td>
                </tr>
            </table>
        </form>
    </div>
</body>
</html>
```
Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com
June 20, 2012 at 2:08 pm method 'toLowerCase' #5160

ScottNL
Member

The answer always easy when you know it.

Thanks a bunch peter.
Author

Posts

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.