I am attempting to use jQuery to dynamically populate the onChange attribute in a text field to run multiple functions. However i get an error in the console stating
TypeError: required is not a function
When i type into the console required('test'); the function exists and returns true.
HTML
<input id="test">
jQuery
var list_of_functions = get_validation(); //this returns a string "required('test'); valid('test');"
$('#test').attr('onChange', list_of_functions);
Then when i go and change the fieldtext, I get an error that the function doesnt exist. Any help? Thanks.
Thanks to all the super helpful comments. I have found a better alternative to what I was attempting to do.
How to turn a String into a javascript function call?
Related
can't figure out how to write this as a function without the jQuery
This works & returns what I need:
var state = $('#order_ship_address_attributes_state_id option:selected').text()
Which is the text from an options list aka "Florda" instead of "3534"
<option value="3534">Florida</option>
However, I would like it written in this convention instead:
var city = ((document.getElementById('order_ship_address_attributes_city')||{}).value)||"";
... to match the rest of my variable declarations.
Trying this but error read "Uncaught TypeError: Cannot read property 'text' of null"
var state = ((document.getElementById('order_ship_address_attributes_state_id option:selected')).text())
Can't figure out the correct way to write this — any help would be much appreciated : )
As #benvc pointed out. You want to use .textContent instead of calling the .text() jquery method.
I'm working with JavaScript JQuery, and when i try to show the content of the vars in a field, it doesn't work.
There is my code:
function editEvolution(pos, nature, desc, di) {
$('#diE').val(di);
$('#natureE').val(nature);
$('#descE').val(desc);
$('#BtnAddEditEvo').attr('value', "Update");
$('#BtnAddEditEvo').attr('onclick', "doEditEvolution("+pos+")");
}
Thank's in advance for help.
the value of fields $('#diE'), $('#natureE') and $('#descE') doesn't change if the vars nature, desc, are strings but it works if it is a number
The problem is that you are mixing the worst from both the native JS, inline JS and jQuery worlds. You NEVER EVER put code inside a string, period. If you do it, you are doing it wrong.
So.. how to do it properly?
$('#BtnAddEditEvo').val('Update').on('click', function() {
doEditEvolution(pos);
});
In case you call editEvolution multiple times on the same object, add .off('click') before the .on(...) call to unbind previous handlers.
First do not use attr to set onclick...
I will explain what is wrong
$('#BtnAddEditEvo').attr('onclick', "doEditEvolution("+pos+")");
if pos="foo", it will render as
<div onclick="doEditEvolution(foo);"></div>
See the problem? It is looking for a variable foo. You would need to add quotes.
$('#BtnAddEditEvo').attr('onclick', "doEditEvolution('"+pos+"')");
^ ^
Why does a number work? Because numbers do not need quotes. It makes a valid call. It renders as:
<div onclick="doEditEvolution(3);"></div>
What you need to do is use jQuery the right way and use events.
$('#BtnAddEditEvo').on('click', function() { doEditEvolution(pos); });
and you should set value with .val()
I am very new to this, but I wrote this and thought it would work first time, but I get an 'ReferenceError: Can't find variable: street' console error.
I get this error if I click on the 'Street' button.
It's quite basic but this is the first time I've made a function to use a var/ref from the onClick attribute.
Please see onClick markup...
Supersport
Street
Cruiser
Scooter
Motocross
Enduro
Kids
then please see my function, which gets the ref error above...
Also please note I am trying to use the onClick var/ref within my function so I can target specific elements relative to the button being clicked.
bikeFilter = function (y) {
$('.bike').fadeOut();
scrollTo(186);
$('.bike[data-group=' + y + ']').fadeIn();
bikeSliderNav();
bikeSlider();
return false;
}
Any expert advice would be really helpful.
Thanks in advance.
You'd probably wanna pass a String as input to your function and not the name of an undeclared and uninstantiated variable.
Try to use the single quotes to refer it as a String constant (you need single quotes since you are already using double quotes to tell your html tag the attribute value):
onclick="bikeFilter('scooter')"
Take a look here to see the difference in data typing in js, and here for a quick start about functions.
You should use them like :
onclick="bikeFilter('motocross')"
Don't forget to put ' around your parameters
I have a form with a select dropdown, and my select tag looks like this:
<select name='preset' onchange='preset(this);'>
Right now I have my JavaScript function just do alert('test');. Well, when I change my selection in the dropdown, I'm getting an error saying "preset is not a function". Yes, I verified that it's spelled right, and I even did a generic call to it on page load and got my alert.
If I change my function name to something else, like presetx it works just fine. So I thought maybe "preset" was some kind of reserved word in JavaScript, but I can't seem to find anything saying as such. Why would this happen?
Update
Currently I don't have anything else on my test page except for my form and the function. No framework includes or other code, so I know it's not anything like that.
Some browsers map elements with name attributes to global variables. So <select name='preset' onchange='preset(this);'> actually creates (in some browsers) a global property preset. This overwrites the preset function.
Since preset is now an HTMLSelectElement object, not a function, you get a "not a function" error.
I have a simple js function:
function changeContent(id, content) {
$(id).html(content);
}
which gets called on ajax callback. id is an id of a div, and $(id) does indeed find it.
On Chrome I get an unhandled exception that HTMLDivElement doesn't contain method html(), while on IE8 and FF simply nothing happens, although when viewing in degub, .html() does appear in the dynamic method list.
What am I doing wrong?
EDIT: No, I'm not passing the id with #. I've tried that, it returned null, now it actually returns something. Is there another problem??
EDIT again: seems I was doing something else wrong. I've put the # back, now it works.
Try use jQuery(id) instead.
You are sure you don´t pass the id without "#" right?
Are you passing simply the ID as a string? In which case I would think it's not truly being found, maybe try this?
function changeContent(id, content) {
$('#'+id).html(content);
}