Issue with a JavaScript function

Question

I have the following form line:

<input class="form_input" type="text" id="Fname" placeholder="First Name" minlength="2" maxlength="30" onkeyup="restrict('name')" />

And the associated JavaScript code:

function restrict(elem) {
    var tf = $('#' + elem)
    var rx = new RegExp()
    if (elem === 'email') {
        rx = /[^a-z0-9@_.-]/gi
    } else if (elem === 'username') {
        rx = /[^a-z0-9]/gi
    } else if (elem === 'phone') {
        rx = /[0-9()-]/gi
    } else if (elem === 'address') {
        rx = /[^a-z0-9_.,-]/gi
    } else if (elem === 'city') {
        rx = /[^a-z.-]/gi
    } else if (elem === 'name') {
        rx = /[^a-z.-]/gi
    }
    tf.val(tf.val().replace(rx, ''))
}

When I try and run the code I get the following error and I can't seem to figure out why after reviewing it many times...

TypeError: tf.val(...) is undefined

Yet everything is defined, so I'm really puzzled.

Thanks for any help! :)

Chase · Accepted Answer · 2020-06-05 01:10:27Z

2

id="Fname" ... onkeyup="restrict('name')"

function restrict(elem) {
    var tf = $('#' + elem)

There is no element with id name.

I suggest you also look at pattern attribute on your input for validation: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes

answered Jun 5, 2020 at 1:10

Chase

3,10417 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Unmitigated · Accepted Answer · 2020-06-05 01:14:25Z

0

Your input has an id of "Fname", not "name". Change its id to name to fix the issue.

<input class="form_input" type="text" id="name" placeholder="First Name" minlength="2" maxlength="30" onkeyup="restrict('name')"/>

answered Jun 5, 2020 at 1:14

Unmitigated

91.4k12 gold badges102 silver badges109 bronze badges

Comments

Sybghatallah Marwat · Accepted Answer · 2020-06-05 01:23:18Z

0

You need to call the function like restrict(this.id)

answered Jun 5, 2020 at 1:23

Sybghatallah Marwat

3121 gold badge3 silver badges18 bronze badges

Collectives™ on Stack Overflow

Issue with a JavaScript function

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related