aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes Jquery with table data markup Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Jquery with table data markup" Watch "Jquery with table data markup" New topic
Author

Jquery with table data markup

Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
Hey folks,

Facing some frustrating issue with jquery



here is the html code


So basically im trying to generate table data on the fly .

I can generate the data successfully now . There are 2 rows of data and i can see them coming up

But the issue is that every click adds to the previous existing data . so 3 click is displaying me 6 rows of data

So how would refresh the table data

Cheers
jquery noob
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

Since you are using jQuery, why are you not using jQuery?

In other words, an onclick in the HTML. really? come on!

I'm not sure what the issue is, I'd suggest cleaning up event handling and then seeing where things stand.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

Also, please, better subjects than "strange issue". Please?
Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
Thanks a lot for the response Bear . No one is born as THE BEST programmer .

I believe in making things work and then look for re-factoring the code and stuff .

Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

If you are here to get quick-fix answers, JavaRanch may be the wrong place. If you are here to learn, you are in the right place. Don't take bluntness as criticism. It's intended to help you.

If you are having issues with event handlers, the first thing to fix is to declare them properly.

If you are using jQuery 1.3 or later, the live() method can let you establish event handlers even before the DOM elements are created. It's ideal for an Ajax environment where elements will come into existence after page load.

(It can also help prevent multiple simultaneous handlers from being accidentally established -- which may be what is at work here.)

Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
im using javascript onClick function because click event doesnt seem to be working with anchor tag.

i have tried all possibilities like



And it doesnt work ( im using 1.2.6 jquery jar )

Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

That will work fine, but assumes that the element already exists. With bind() and click(), you can't instrument an object that does not exist yet.

Where are you trying to establish the click handler?

In jQuery 1.3 and later, you'll be able to use live(). In jQuery 1.2 you'll either need to do it in the callback handler from the Ajax call after the DOM has been created, or use the livequery plugin.

Using onclick in the HTML is never the right thing to do.
Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
Hey Bear ,

im looking into livequery now . Looks lke rocket science for me

in the meantime i have a small query that popped up .

i have an anchor tag with onClick javascript method associated with it (as you saw in my example) . My query is , first time i click it ,the request is served and the data shows up in the div . the second click on the expanded div ,it collapses but again a request is sent to the server .

how do i stop this
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Are you canceling the click action on the link?

Eric
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

If you don't want subsequent clicks, you should remove the event handler after the first click.
Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
@eric

i did not quite understand your question . what did you mean by "canceling"
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Your link is still acting like a link. It is resetting the page so you need to stop that action from happening.

http://api.jquery.com/event.preventDefault/

Eric
Naveen puttu
Ranch Hand

Joined: Sep 15, 2009
Posts: 88
@eric

the link that your talking about doesnt work with 1.2.6 version that im using right now.

So, im trying to use livequery and NO GO .

Can you tell me how to go about fixing this wrt the code snippet in this post
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

The more interesting question to ask is: if you don't want it to act like a link, why use an <a> tag at all? All you are doing is making things way more complicated than they need to be, creating a lot of work for yourself, and creating points of failure.

You can make anything clickable; don't use a link if you don't need a link.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: Jquery with table data markup