call a javascript function using string name - javascript

It is a bit complicated for to explain properly what I mean, so please try to understand me :)
I want to be able in javascript to call a element method/function using text sent as parameter. For example:
function CallAFunction(function_name){
document.getElementById('some_id').function_name();
}
As you see in the above example, I want to send function_name as parameter, and it is type of string or a simple text. So how I can use this function name to call it like that ?
Or, please suggest me something which may help me get the same as I need.

Use bracket notation;
document.getElementById('some_id')[function_name]();

call function name using string :
var myFunc = window[myFuncName];
you can sent parameter like this :
<button onclick="myFunction('Harry Potter','Wizard')">Try it</button>
<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>

Related

Multiple attribute on href using onclick

I Tried this code to get multiple value in href but it does not work. any problem on this one ?
Print
You are missing a + sign between a string and a value.
The error is between this two
document.getElementById('CUS_CODE_MX').value '&AGE='
Correct format
document.getElementById('CUS_CODE_MX').value + '&AGE='
Every time you join a value and a string, you need a + sign
Even if you are joining two strings
'Hello'+ 'World'
Pliss avoid long js as an inline atribute. I will recommend you call a function as the onclick attribute.
Hope this helps :)
Print
It's better to use external script for that rather than inline format. And just add missing + to your code. Also, using variables would clean up the code.
function func() {
var CUS_CODE_MX = document.getElementById('CUS_CODE_MX').value;
var AGEID = document.getElementById('AGEID').value;
this.href = 'printsales.php?CUSTOMERID='+CUS_CODE_MX+'&AGE='+AGEID;
}
Print

Call javascript function error

I have a problem, i have to call a function from a button onclick().
Javascript :
function deleteFolder(elemento){
var form=document.getElementById(elemento);
var conf=confirm("Sei sicuro di eliminare questa cartella?\nL'eliminazione sara' definitiva");
if (conf === true)
form.submit();
}
This function get a paramater made by php ,the pRoblem is that if this parameter has some space inside, the function is not called ..
deleteFolder(FolderName) --> It works
deleteFolder(Folder Name) --> of course it doesnt works
From php i just scan directories and put names of them in multiple form with foreach() function.
So the question is :
1) How from php i can put parameter that works with calling javascript's function with spaces inside?
2) If i have a directory called "Folder's name", it's enough put addslashes in $_POST to bypass XSS? because it cut all next the apostrophe and became :
HTML
<button onclick="deleteFolder(Folder)">
Thanxs for any suggestions, i can't find anything similar already in this forum.
I am assuming that you are passing a string to the deleteFolder() method. If that is the case, use the following code.
<button onclick="deleteFolder('FolderName')">
<button onclick="deleteFolder('Folder Name')">
You should use quotes to indicate that you are passing a string to the function. This should fix your problem.
You can put the actual folder name in a separate attribute say folder-name and in the id have incremental numbers, with this being in place following change would be needed in your JavaScript function.
HTML
<button folder-name="Folder" onclick="deleteFolder(id)">
JavaScript
function deleteFolder(elemento){
var form=document.getElementById(elemento);
var folderName = form.getAttribute('folder-name');
// then use the folderName however you want it.
}
Thanxs to all replies ! =)
I solve it adding " (--> " ) in php
first
"<button onclick='deleteFolder(".$elem."); return false;'>Elimina</button>"
next
"<button onclick='deleteFolder("".$elem.""); return false;'>Elimina</button>"
So the parameter became a string and can be passed to the function =)

3 layers of embedded quotes, JS function not registering variable

The code looks something like this:
<?php
$page->startscript();
echo "
function f1(id){
$('#def').html('<button class=\'btn btn-danger\' onclick=\'f2(id);\'>act</button>');
}
function f2(id){
alert(id);
}
";
$page->endscript();
?>
The startscript(), endscript() thing works fine, it just allows me to add JS to the page. What doesn't work is id isn't carried over from f1 to f2, its just returning blank. I think it has something to do with the quotes and not being treated as a variable. If I pass an int as the parameter for the onclick attribute it works fine.
Variables aren't expanded inside strings in Javascript (ES6 adds "template strings", which support this), you need to use concatenation. And assuming id is a string, you need to put quotes around it in the function call.
echo"
function f1(id){
$('#def').html('<button class=\'btn btn-danger\' onclick=\'f2(\"' + id + '\");\'>act</button>');
}
function f2(id){
alert(id);
}
";
It's got to do with the context of your f2 function.
Since the function isn't present on the page, the scope in which the rendered JS is looking can't really find the function you've declared.
I've created a basic fiddle that shows you how you can achieve what you're looking to do here. JSFiddle
Basically, your js will call the f1 function like so:
function f1(id) {
$('#def').append('<button class="btn btn-danger" onclick="f2(' + id + ');">act</button>');
}
f1("10");
your HTML will need to look something like this:
<div id="def">
</div>
<script>
function f2(id){
alert(id);
}
</script>
Also, the JS that you're rendering is literally passing in the id to f2 as a string and not the value.
Hopefully you can see what you need to do.

How to call a function defined as a string?

I want to define functions and scripts in a database record then using Javascript convert the database field from a string to code.
I was thinking I could use 'eval', but this doesn't seem to work.
As an example:
var strTest = "function(strParams) { alert('hello: ' + strParams); };"
,fn = eval(strTest);
fn("World");
This doesn't work, eval returns undefined, hopefully this gives the idea of what I am trying to achieve.
The problem is that eval parses your function as a function declaration. But function declarations require a name.
Instead, you should make it a function expression, which doesn't require one.
var strTest = "(function(strParams) { alert('hello: ' + strParams); })";
eval(strTest)("World");
Only do this if you trust the string.
Alternatively, you may be interested in the Function constructor:
var f = Function("strParams", "alert('hello: ' + strParams)");
f("World");
You could try something like this:
<script src="http://my-server/js-func/foobar.js"></script>
and have the server serve up the JS retrieved from the DB at that endpoint.

javascript change name of called function

Hi all im very new to javascript so please be gentle.
im mixing php with my calls and I have a slight issue.
I need to alter the function name that is called in an onclick event.
<div class=\"span4\" id=\"pass\">
<button class=\"btn btn-block btn-large btn-warning\" id=\"bypass\" disabled onclick=\"pass(); return false;\">
-
</button>
</div>
above is the div with the std call.
before this point some variables are set from another function call and I need to change the above call to "pinpass2() or pinpass3 etc.
function pincheck(id,type,lastid,pin){
document.getElementById('fade').style.display=\"block\";
document.getElementById('calc').style.display=\"block\";
var staffid = id;
document.getElementById('bypass').onclick = function (){\"pinpass\"+staffid();
return false;
};
}
the above is the function that should do it but i can't seem to get it working.
Any help appreciated.
p.s if i include the following into the pincheck function the desired staffid is diaplayed
alert(\"staff id\"+staffid);
document.getElementById('bypass').onclick = pinpass2;
That should work just fine. pinpass2 is already a function, you can assign it to onclick like any other object (yes, functions are objects in Javascript). So just change the onclick when you need it.
If you can't detect changes to the result of staffid(), then you should use a switch instead.
document.getElementById('bypass').onclick = function() {
switch(staffid()) {
case 1: pinpass(); break;
case 2: pinpass2(); break;
default: pinpass3(); break;
}
};
Though most of the time you don't have to do this. Also, I'm not sure if staffid is supposed to be a function or a variable, but it doesn't change anything.
By the way, this way of attaching handlers is quite old. There's a more powerful one:
document.getElementById('bypass').addEventListener('click', pinpass2, false);
With that you can attach more than one function. To remove one:
document.getElementById('bypass').removeEventListener('click', pinpass2, false);
You can change the onclick attribute the same way you'd change any attribute ?
var elem = document.getElementById('bypass');
elem.setAttribute('onclick', 'pinpass' + staffid + '(); return false;');
FIDDLE
In javascript functions are first class so you can literally just assign pincheck to another variable like this.
var pinpass2 = pincheck;
Now you can still call it like this
pinpass(1,2,3,4);
I'm not 100% from your question, but it looks like you are trying to call a different function based on the staffid variable. I.E. if it is 2 you want to call pinpass2().
If this is a global function you can call window[ 'pinpass' + staffid ]() and it will call the function you want (if it exists).
EXAMPLE: if staffid = 2 then window[ 'pinpass' + staffid ]() is eqivalent to window[ 'pinpass2' ]() which is the same as calling pinpass2().
This works because all global vars (including functions) are properties of the window object, and properties can be accessed using a dynamically generated name and square bracket notation.

Categories

Resources