Can someone tell me why is the call to my function hideShow not working ?
<a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>
function hideShow(number){
alert("i am here");
$('#errMsgGroup'+number).toggle('slow', function() {
if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'hide errors');
}
else{
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'show errors');
}
});
}
5 Answers 5
put your function within <script></script> tag
Like
<script>
function hideShow(number){
alert("i am here");
$('#errMsgGroup'+number).toggle('slow', function() {
if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'hide errors');
}
else{
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'show errors');
}
});
}
</script>
answered Jul 2, 2013 at 10:20
Sonu Sindhu
1,80216 silver badges27 bronze badges
Sign up to request clarification or add additional context in comments.
Comments
I guess you need to close your A-tag as well like <a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>hide / show</a>
answered Jul 2, 2013 at 10:20
putvande
15.3k3 gold badges37 silver badges51 bronze badges
4 Comments
Felix Kling
If you think that's the problem than you should also mention that JavaScript code belongs inside
<script> tags.Joseph
MY FUNCTION IS INSIDE THE SCRIPT TAGS ,AND MY a TAG IS CLOSED AS WELL I JUST DIDNT POST IT.
Felix Kling
@user2515601: How are we supposed to know that? Maybe you should post a more complete code example.
putvande
@FelixKling Sorry, it was a reply after someone else already mentioned that the function should be within the script blocks. That's why I didn't mention it.
In addition to @sonusindhu and @putvande answers. You probably want a return false at the end of your javascript.
function hideShow(number){
alert("i am here");
$('#errMsgGroup'+number).toggle('slow', function() {
if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'hide errors');
}
else{
$('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
$('#plusMinus'+number).children('img').attr('title', 'show errors');
}
});
return false;
}
answered Jul 2, 2013 at 10:23
DickieBoy
4,9661 gold badge31 silver badges49 bronze badges
1 Comment
Joseph
OK GUYS, i found out what was causing the problem. It turned out that i have some parasite characters in my php file, some sort of ^M which i was only able to see with a cat -v, i looked it up on the net and found that by doing a dos2unix command on the files in question u delete all the undesired chars. It worked out for me. THANK YOU ALL FOR YOUR TIME.
Try this
<html>
<head>
<script type="text/javascript">
function hideShow(number) {
alert("i am here");
$('#errMsgGroup' + number).toggle('slow', function () {
if ($('#plusMinus' + number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0) {
$('#plusMinus' + number).children('img').attr('src', 'images/NORIA_plus.JPG');
$('#plusMinus' + number).children('img').attr('title', 'hide errors');
}
else {
$('#plusMinus' + number).children('img').attr('src', 'images/NORIA_minus.JPG');
$('#plusMinus' + number).children('img').attr('title', 'show errors');
}
});
}
</script>
</head>
<body>
<a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>Check</a>
</body>
</html>
answered Jul 2, 2013 at 10:36
Raghurocks
9258 silver badges20 bronze badges
2 Comments
Joseph
i am still not getting my alert :/
Raghurocks
I already checked it, I get alert. Once see for console errors, or else copy the html I have given into a sample page and run it you will get the alert :)
Try this:
<a id='plusMinus0' href='#' onclick="hideShow(0)">Test</a>
<script>
function hideShow(number) {
alert(number);
}
</script>
EDIT:
I think it's more elegant to handle the event with JQuery:
<a id='plusMinus0' href='#'>Test</a>
<script>
$(function() {
$("#plusMinus0").click(function() {
alert("pass parameter from an attribute " + $(this).attr("id"))
});
});
</script>
With # in href, after click your anchor navigates to top of page, to avoid this:
<a id='plusMinus0' href='javascript:;'>Test</a>
or leave the href attribute: Without href
answered Jul 2, 2013 at 10:25
speti43
3,0622 gold badges22 silver badges26 bronze badges
5 Comments
Felix Kling
If you use jQuery, then you should remove
onclick="hideShow(0)".Joseph
I am using the onclick bc i have multiple PLUSes so i need to pass a variable in the function definition.
speti43
ok, it's your choice, but you can pass parameters via anchors attributes also.
Joseph
jsfiddle.net/pv33P/3 can u please tell why this simple test is not working ?
speti43
Yes, on the left side change the framework extension "on load"=> no wrap - in head jsfiddle.net/pv33P/6
lang-js
<script>tags?alertfor me, even with the new markup: jsfiddle.net/GYM38/1. If you want useful help, create a jsfiddle.net demo with the problem.ReferenceError: hideShow is not defined. ChangeonLoadin the select box toNo wrap - in <head>. Since you said earlier that you don't get an error, I wonder if this is really the issue or you just didn't know how to use jsfiddle properly.