unable to call javascript function using button's onclick event

Question

My display.php file has the code for fetching data from database and display it in html table. I want to display this table on my index page only in the <div> displayTable section and for that I've called the showTbale() using onclick of my button abc. But the problem is that the function showTable() doesn't get called even though I've successfully called the logoutEmp() using the onclick of the logoutButton. I don't understand what's the problem. Any help would be appreciated.

NOTE: I tried using form action to call display.php but it displays the table in another white page which I don't want. Also I don't want to include display.php code in my index page.

say this is my index file :

<head>
<meta http-eqiv="X-UA-Compatible" content="IE=9,chrome=1">
<link rel="stylesheet" type="text/css" href="page_style.css">
<script src="jquery-1.10.1.js"></script>
</head>

<body>
<script>

function logoutEmp()
{
  window.location="saveLogout.php";
}   

function showTable()
{
  var month= $('#mnth: selected').val();
  alert (month);

  $("#displayTable").load("display.php",{ mnth: month});
}   

</script>

<h1>Employee Account</h1>

<div id="logoutEmp">
<button type="button" id="logoutButton" onclick="logoutEmp()">Logout</button>
</div>

<hr>

<div id="shw">
<select name="mnth">
<option value="Jan">January</option>
<option value="Feb">February</option>
<option value="Mar">March</option>
<option value="Apr">April</option>
<option value="May">May</option>
<option value="Jun">June</option>
<option value="Jul">July</option>
<option value="Aug">August</option>
<option value="Sep">September</option>
<option value="Oct">October</option>
<option value="Nov">November</option>
<option value="Dec">December</option>
</select>
<button type="button" id="abc" onclick="showTable()">Display</button> 


<div id="displayTable">
</div>

</div>

</body>
</html>

whats the crazy backslash in your function? and try document.location.href="saveLogout.php" instead of window.location — steven
– steven, Commented Jun 19, 2013 at 5:50
You are calling "showTbale()" but your function name is showtable(). Is it a typo ? — Vivek Sadh
– Vivek Sadh, Commented Jun 19, 2013 at 5:51
if you already using jquery then you should assign the onclick with $('#logoutButton').click(function(){}) inside your $(document).ready() — steven
– steven, Commented Jun 19, 2013 at 5:52
@steven emm: developer.mozilla.org/en-US/docs/Web/API/window.location . Though, I agree on the backslash. — Alxandr
– Alxandr, Commented Jun 19, 2013 at 5:54
@Alxandr ok, i agree. But it should be window.location.href, not window.location — steven
– steven, Commented Jun 19, 2013 at 5:56

isJustMe · Accepted Answer · 2013-06-19 05:52:51Z

1

change your code like this:

function logoutEmp(){
 window.location.href="saveLogout.php";
 }

You had an extra slash, and a syntax error.

Also, you should change showTable that was wrong as well :

function showTable()
{
  var month= $('#mnth').val();
  alert (month);

 $("#displayTable").load("display.php",{ mnth: month});
 }

And add your id to your select:

<select name="mnth" id="mnth">

Here is the demo my friend.

answered Jun 19, 2013 at 5:52

isJustMe

5,4902 gold badges33 silver badges48 bronze badges

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

Comments

Zaheer Ahmed · Accepted Answer · 2013-06-19 06:19:22Z

0

I guess:

function logoutEmp()
{
 window.location="saveLogout.php";
 \}

that backslash should not be there:

function logoutEmp()
{
 window.location="saveLogout.php";
}

you can not call showTable() because in JavaScript if there is any error script after that error would not work.

edited Jun 19, 2013 at 6:19

answered Jun 19, 2013 at 5:52

Zaheer Ahmed

28.7k12 gold badges77 silver badges113 bronze badges

1 Comment

Tileshwar Nath Over a year ago

why is everyone giving solution to logoutEmp()...thats working fine...I'm asking why i'm unable to call showTable() using onclick

Collectives™ on Stack Overflow

unable to call javascript function using button's onclick event

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related