how to call javascript function from client side on anchor click - javascript

I have javascript function sample('textValue') and have to call at server side on anchor click. I tried below code
string text="xyz";
anchor.Attributes.Add("onclick","javascript:sample('"+text+"');
but the value of the text is not assigning correctly. Encoded string gets added. The result in view source looks like
javascript:sample('xyz')
But i need javascript:sample('xyz')

What server/backend language do you use? PHP? Do you use any framework (Zend, CakePHP...)?
On the JS side do something like this:
Option 1
Test
Option 2
Test
<script type="text/javascript">
document.getElementById('clicky-clack-link').onClick = function() {
sample('test');
};
</script>
Note: Also check out jQuery if you haven't.

I wonder if you could just do this:
string text="xyz";
anchor.Attributes.Add("onclick", function(){ sample(text); } );
What does it do? Well, the onclick handler takes a function with no arguments, right? That is, what to do if somebody clicks the link. If you're coding this by hand in HTML, you can use the javascript:a_statement_goes_here to describe the code to run. I expect the browser will just create a function out of that. Since you're assigning this in JavaScript, you have to do that yourself (unless you write out to the document - that might work) and assign the function. But you don't have such a function yet - you have one sample that takes an argument - hence the anonymous function closing the text argument.
This is based on the assumption, that the above is actually client-side code. I'd be very surprised, if JS didn't allow you to assign a function to an attribute. In fact, I think the problem you are running into, is JavaScript trying to be very smart and make sure assigning a string, will stay a string - that is why your ' got encoded.
Have a go, tell me how it went. Ta!

Related

How to extract javascript variable value using imacros browser?

I have looked but I simply cannot find an answer to what I expect should be a very simple task.
I have navigated to a page that contains a known javascript variable.
eg: var foo='my variable text';
How can I extract that value ('my variable text') using iMacros browser? Is that even possible to do directly?
Or, would I have to execute javascript to place that variable's value into an input or tag, that iMacros can then extract from?
Many thanks in advance.
You can use the URL GOTO method to call a javascript function, which will load the value inside the input element. Please checkout the below example where I have replicated the same.
HTML:
<script>
var a = "naren";
</script>
<input type="text" id="naren"/>
IMacros:
VERSION BUILD=9030808 RECORDER=FX
TAB T=1
URL GOTO=javascript:{(function<SP>(){console.log(document.getElementById(a).value='works!')})()}
So I have made a mockup page with the html as above, then ran the below imacros.
Some points you need to know about calling the imacros script are:
I have wrapped the anonymous function as an iife, long story short, the function will get executed immediately.
If you visit the IMACROS URL wiki page There is a line which tells us.
The URL GOTO command by default outputs the result of the evaluated
Javascript expression on a new page in the current tab. If you want to
manipulate an element on the page and don't want the result to be
processed by the URL GOTO command, you need to wrap it in some other
call or expression that does not evaluate to any value.
For example, to change the value of the Name field on the demo Fill
Form page, you can wrap the call in console.log() as follows:
URL GOTO=http://demo.imacros.net/Automate/TestForm1 URL
GOTO=javascript:console.log(document.getElementById("name").value='Test');
So I have implement the above statement by wrapping the assignment done to the input element inside a console.log.
Please let me know if you have issues implementing this solution!

about javascript event handler, it works weird

I am a beginner in javascript. and have no experience in programming, at all.
So I'd like you to be generous to beginner.
And here is my question.
I'm trying to code javascript unobtrusively.
So I put in all of my js codes into external js file. for example : test.js
and deleted these codes. to do unobtrusive js coding. for example :
and I tried to use these 2 methods :
variable.onclick=test(arg1, arg2);
variable.addEventListener('click',test(arg1, arg2),true);
but these triggers didn't work.
to put it delicately, function test(arg1, arg2) worked right after dom loding finished. regardless of activating 'click' trigger.
So I spent several hours solving this problem, and finally got a solution. this is it.
variable.onclick = function(){
variable.addEventListener('click',test('arg1','arg2'),true);
}
I wanna know why first two methods didn't work, and why that solution works well.
I solved the problem, but don't know why, and how...
In JavaScript, when you reference a function by name and follow that reference by a parenthesized list of arguments, that means that you want to call the function, right then and there. Thus a statement like
variable.onclick=test(arg1, arg2);
will assign to the "onclick" property the value obtained by calling the "test" function. In other words that statement means
Please call the function "test" passing it "arg1" and "arg2", and assign whatever it returns to the "onclick" property of the object referenced by "variable".
An event handler must be a function, however, and your "test" handler probably returns either nothing, or something that's not a function. So it didn't work.
Your solution, however, is also incorrect. You're successfully assigning a function to the handler property, but your function is itself installing another event handler. There's no reason to do that here, and in general setting up event handlers from within other event handlers is a suspicious practice. All you need is:
variable.onclick = function() { test(arg1, arg2); };
variable.onclick requires a function declaration by design. In your case you could have just done
variable.onclick = function(){
test(arg1,arg2);
};
The way you did it won't work because you're not giving the click handler any instructions. The corrections I have made say that when the variable (the one with the click handler attached) is clicked trigger this function that will in turn trigger the test function.
Same thing goes for the second one
variable.addEventListener('click', function(){
test(arg1,arg2);
});
This works again because you are saying when this variable is clicked run the function that will trigger the test function.
Basically you are trying to assign the result of running a function, the test function as a task for the click handler to run. This won't work except maybe your test function returns a function that contains code that you want to run when the click event is triggered. Hope this helps.

JavaScript: how to pass object value from one function to another

I am using code lines like the following in order to fetch data from an intranet website:
util.setProp(obj, "firstNameOld", $(msg).find('#fname_a').text());
Now I have another function in the same file where I want to use the above again, resp. the value of that object - currently I am hard-coding this ('Test') for test purposes:
util.setProp(obj, "firstNameNew", 'Test');
How can I pass the value from the firstNameOld object in one function to the firstNameNew object in another function ? If a solution with global variables is better here than this would work as well.
Many thanks for any help with this, Tim.
I've never used the framework that includes util But I imagine that if there is a setProp() then there has to be a getProp() or something similar.
If so, you could do something like
util.setProp(obj, "firstNameNew", util.getProp(obj, "firstNameOld"));
This also relies on the assumption that you want to copy from two properties in the same object.
If not, then pass the desired source object in the getProp() call.
My guess is that functions (or properties) are called "firstNameOld" and "firstNameNew", so the first time you get it from selector, second time you want to do the same.
Try to use the local variable like that:
var text = $(msg).find('#fname_a').text();
//
util.setProp(obj, "firstNameOld", text);
//
util.setProp(obj, "firstNameNew", text);

Assignement of a variable inside a concatenation

I have a global variable var num_tab=1;, a function that creates a link a href :
function Addsomething()
{
$("#tout").html("<a style=\""+"margin-left:-20px;"+"\" onClick=\"eval(num_tab=2)\" href=\""+"#tab1"+"\" data-toggle=\""+"tab"+"\">SELECT</a>");
Bla,Bla..
$("#champ1").append('<li id=\"1\" class="champ" onclick="insertAtCaret("sousTab'+num_tab+'");" value=\"1\">1</li>');
}
What i want to do is to create a href that when clicked changes the value of the variable num_tab, but if you can see the href is inside a jquery html(), which makes me confused about how to assign a value to the variable. I almost tried everything: onClick=\"num_tab=2\",onClick=\""+num_tab+"=2\"
Actually i tried something: when i write onclick='num_tab=2;alert("+num_tab+");' i still get the initial value of num_tab, seems it's more like a problem of local and global variable and i can't figure out it yet.
Please don't use eval(). It's insecure and not the appropriate tool for this job. Just assign a function to the onclick:
$("#tout").html("<a onclick='set_num_tab(2)'">); //fill out the rest of this line
function set_num_tab(value) {
num_tab = value;
}
That should give you an idea of how to do it. btw there's no reason you can't use single quotes around an onclick like that.
Alternately, this would work:
$("#tout").html("<a onclick='num_tab=2'">);
But that's pretty messy. I try to avoid inline JavaScript.

Javascript override problem class xml

Not sure what is the problem , this the second post looking for the answer.. but this time with a with the example .
What i'm doing : I 'm implementing a gallery that is getting a xml, and then build me using some javascript code. the problem i tried to call twice gallery.init like :
$(document).ready(function(){
galleryXML.init({
id: "#gallery1"
});
galleryXML.init({
id: "#gallery"
});
})
I expected to have one in #gallery1 other in #gallery. Can someone tell me what the problem(it only happen when i had the loadXml() , so probably something with asynchronous call not sure )?
I think your problem can be that you are using the same variable _P for (what you expect to be) 2 different instances of the galleryXML.
The _P variable is created and initialized when the javascript code is parsed, because of the () after the var galleryXML = function() {...}.
So I guess your problem is going to be solved if you just put the variable inside the init of galleryXML. You can see the code here: jsfiddle.net/rpNab/3/ (notice that now each li is inside each gallery, instead of both li in the last gallery)
EDIT: And I realize that now with my modification the galleryXML module seems ugly (because it only has one method and no variables), so I made a minor refactoring in order to have more methods inside that class, but the methods now must receive the parameter because the class itself continue to be "static", but the parameters can make it act for different contexts. Hope it helps: jsfiddle.net/rpNab/4/

Categories