How to call two different javascript function for css class with different id

In my form there are two anchor tags Add and Clear having same class called button. What I am trying is submit the form data to another page(post) using ajax & clear is for clearing the data using javascript.The problem is that as both buttons having the class the same function(submit) is called for both button.
css is look like:

Expand|Select|Wrap|Line Numbers

 form.addwords .button

{

  font-weight: bold;

  color: #ffffff;

  cursor: pointer;

  font-size: 15px;

  height: 43px;

  width: 107px;

}

form.addwords #addwordsbutton

{background:url("../img/leftbtn.png") no-repeat 0 0;}

form.addwords #clearwordsbutton

{background:url("../img/rightbtn.png") no-repeat 0 0;}

JS script

Expand|Select|Wrap|Line Numbers

 
jQuery('.button').live('click', function(event) {

var da=$('#addwords').attr('value');

alert(da);

$.ajax({

type: "POST",

url: "addmulti.php",

data: "knw=" + da,

success: function(data){

$('#results').html(data);

},

error: function(){

alert('Error');

}

});

});//end of .button click

form code

Expand|Select|Wrap|Line Numbers

 
<a href='#' class='button' id='addwordsbutton'><span class="try">Add</span></a>

<a href='#' class='button' id='clearwordsbutton' onClick='this.form.reset();'><span class="try">Clear</span></a>

<input id="myButton" type="button" value="To check" onclick="this.form.reset();">

What methods I tried?
1. changed the changed the line to check whether the inline reset call is triggering or not. but no success.

Expand|Select|Wrap|Line Numbers

 jQuery('.button').live('click', function(event)

to

jQuery('.buttons').live('click', function(event)

2.Added dummy button of input type button. This time inline onclick event is triggered

Dec 13 '10 #1

Subscribe Post Reply

3654

JKing

1,206

Expert 1GB

Call the function based off the id instead of the class.

Expand|Select|Wrap|Line Numbers

jQuery('#addwordsbutton').live('click', function(event)

Dec 13 '10 #2

CarlosMartooni

Here is some code I used to test these problems.

I thought it might help someone else:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title> JQuery Test </title>

<script type="text/javascript" src="../AllInOne/AllRef3/jquery-1.4.2.min.js"></script>
<a href="http://jquery.com/">jQuery</a>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

<style type="text/css">

</style>

<script type="text/javascript">
$(document).ready(function() {

//jQuery('.button').live('click', function(event) {
jQuery('.button').live('click', function(event)
//jQuery('.addwordsbutton').live('click', function(event)
{
//var da = $('href').attr('value');
var da = $(this).attr('href')
alert(da);
$.ajax({
type: "GET",
url: da, //"addmulti.php",
data: "knw=" + da,
success: function(data) {
$('#results').html(data);
},
error: function() {
alert('Error');
}
});
return false;
}); //end of .button click

});
</script>

</head>

<body>

<form id="adwords" action="post" >
<table>
<tr>
<td>
<a href='testJQuery.htm' class='button2' id='a2'><span class="try">Home</span></a>
</td>
</tr>
<tr>
<td>
<a href='testJQuery.htm' class='button' id='addwordsbutton'><span class="try">Add</span></a>
</td>
</tr>
<tr>
<td>
<a href='Donald.duck' class='button' id='clearwordsbutton' onClick='this.form.reset();'><span class="try">Clear</span></a>
</td>
</tr>
<tr>
<td>
<a href='#' class='button' id='A1' onClick='this.form.reset();'><span class="try">Go</span></a>
</td>
</tr>
<tr>
<td>
<input id="myButton" type="button" value="To check" onclick="this.form.reset();">
</td>
</tr>

</table>

</form>
</body>
</html>

Nov 12 '11 #3

by: jkarpago | last post by:

Hi: I have three different web pages with different domains, and I want to show some pages of one of the webs in the others. I use an iframe for this and it shows it good until I have to call a...

Javascript

A Challenge: Call parent Javascript function from inside an iframe?

by: Chris Ianson | last post by:

Hi geniuses (or is that genii, or genies) The challenge is as above really. I have a page with an iframe in it, and need to call a JS function in the *parent* page, *from* inside the iframe. ...

Javascript

Call a javascript function in an iframe from other frame

by: Fuhrer | last post by:

Hi all, i have an HTML page divided in 2 Frames (frame1,frame2); in frame1 i have an iframe(datamain), my problem is : i'm trying to call a javascript function( hidemenu() ) in the iframe from...

Javascript

how to call a javascript function from c#.net?

by: nirmalsingh | last post by:

hai all, I want to call a javascript function from code behind c#(not in any event, just call at when a condition satisfies). How can i do this? thanx in advance.

.NET Framework

How to call a javascript function on selected index changes in a RadioButtonList?

by: ameetijantakar | last post by:

Hi, I want to call a javascript function in attributes property of a RadioButtonList control when user changes his selection

.NET Framework

Call a javascript function to the page load event

by: jmohan | last post by:

Hi everyone, I am developing a website using asp.net with C#. And I developed a toolbar using javascript like google and yahoo toolbar which is placed in the browser separately. Toolbar has...

.NET Framework

How to call javascript function from different<div> ?

by: saadkhan | last post by:

I`v made the following code: <div id="Panels" style="width: 28%;"> <asp:Panel ID="one" runat="server" CssClass="Panel"> <div id="Head" onclick="doToggle();"> ...

Javascript

How to call single javascript function for different <div> tags?

by: saadkhan | last post by:

I`v made the following code: <div id="Panels" style="width: 28%;"> <asp:Panel ID="one" runat="server" CssClass="Panel"> <div id="Head" onclick="doToggle();"> ...

.NET Framework

How to call a Javascript function from iframe

by: malathib | last post by:

Hi, I have used a rich text editor in my application. I got it from one of the site.all are JS files. My problem is, i want to call a javascript function from the iframe. Can anybody help...

Javascript

How to call a javascript function from a php echo

by: chanshaw | last post by:

Hey I'm trying to echo out an onclick event that calls a javascript function echo " <tr> <td> <input title='Add New Link' type='image' height='24' width='24' src='add.png' name='add_link'...

PHP

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

How to call two different javascript function for css class with different id

Similar topics