Solved

Jquery, getting clicked a element's id and replacing another a element's href attribute.

Posted on 2011-02-26
4
660 Views
Last Modified: 2012-05-11
Hello all,

 I'm new to Jquery. Didn't have time yet to sit and read about it. Just read 1-2 articles and I realized it is more or less like a PHP, so I am trying to get some stuff work with Jquery.

  I don't know if I should mention that I am currently using Jquery Tools library.

What I am trying to do is;
1. When I click delete link, Jquery will get the id of the a element.
2. Opens a modal box, replace "yes" link's href to confirm and delete the data.

 I have everything working except 1 fatal problem.

Here is my list;
ID - TITLE - DELETE
5 - Test 5 - delete
4 - Test 4 - delete
3 - Test 3 - delete
2 - Test 2 - delete
1 - Test 1 - delete

 When I click ID number 1, it is opening modal box and asking for confirmation. Everything works just fine as long as I will not click "no" and close the modal box and try to delete another one.

var formUrl = "includes/ajax/forms.php?do=delete_news&id=";
		$("a.confirm").click(function() {
				deleteUrl = formUrl + this.id
				// Add delete link to confirmation button
				$("a[href='#deleteUrl']").attr("href", deleteUrl)
			
			return false;
		});

Open in new window


If I click on ID 1, the link is includes/ajax/forms.php?do=delete_news&id=1

Problem is, if I click no and later try to delete ID 2, it is still showing the same URL (includes/ajax/forms.php?do=delete_news&id=1)

Whichever ID, I will click first, if I will click no and try to delete another one, the first clicked element's ID is staying as permanent.

I will be glad if anyone could help me out with it.
0
Comment
Question by:pixalax
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 34989078
With this line : $("a[href='#deleteUrl']").attr("href", deleteUrl)
You replace the href of all the anchors and not only the one you to update
0
 
LVL 4

Expert Comment

by:andreizz
ID: 34989092
<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button");
if (r==true)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }
}
</script>

Open in new window


This is how you use a confirm. http://www.w3schools.com/JS/js_popup.asp 
0
 
LVL 2

Author Comment

by:pixalax
ID: 34989126
@andreizz;
I don't want to use confirmation like an alert window. I prefer modal boxes, stylish yes - no buttons.

@leakim971;
Thank you for your comment. I was thinking why I can't update second time I click another link. Why the ID value wasn't changing.
Actually it was changing. The problem was, simply there wasn't href="#deleteUrl" anymore to replace, since it was replaced before with another value.

I just made a small modification and it is working perfectly. Thank you for your help.
var formUrl = "includes/ajax/forms.php?do=delete_news&id=";
	$('a.confirm').bind('click',function(){
		// Get ID of the element
		var deleteUrl = formUrl + $(this).attr('id');
		// Add delete link to confirmation button
		$("a#confirmBtn").attr('href', deleteUrl)
	 })

Open in new window

0
 
LVL 2

Author Closing Comment

by:pixalax
ID: 34989132
Thank you once again for your fast reply.
0

Featured Post

The Ultimate Checklist to Optimize Your Website

Websites are getting bigger and complicated by the day. Video, images, custom fonts are all great for showcasing your product/service. But the price to pay in terms of reduced page load times and ultimately, decreased sales, can lead to some difficult decisions about what to cut.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

688 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question