jquery: read div id and remove appropriate div?

hey, had no idea what title this post should have, hard to describe :)

i have a dynamic id's with a number

<div id="post-full-116">Content</div>

<div id="post-116">Content</div>

i want to query the dynamic number (in this case 116) of id="post-full-116" and if another div on the page with id="post-116" exists i want to remove that.

sounds weird i know. so you get the idea behind it, the div with id="post-number" holds a preview of a post and the the div with id="post-full-number" holds the full content of a post.

i don't want to show the preview of a post if the full post is already shown - so i simply want to hide it with jquery. i know i should do that on the serverside before, however in this case jquery would be perfect.

any idea how i can query the number of the dynamic id and the remove the appropriate div with the same number?

thank you

Answers


I'm thinking you would do something like this:

$(function() {
    $('[id^=post-full]').each(function() {
         var num = $(this).attr('id').replace(/post\-full\-/,'');
         $('#post-' + num).hide();
    });
});

That should grab any "full" posts, find the number of the post, and hide the "preview" version of it.

UPDATE:

Here's a live demo of that: http://jsfiddle.net/Ender/saUQf/


$('div[id^="post-full"]').each(function(){
    $('#post-' + this.id.split('-')[2]).remove();
});

.toggle() will show the div if its hidden, and hide it if its visible. Example:

$("#post-full-116").toggle();
$("#post-116").toggle();

Alternatively you could check if the div was visible or hidden with this:

if ($"#post-116").is(":visible")
{
  $("#post-116").hide();
  $("#post-full-116").show();
}
else
{
  $("#post-116").show();
  $("#post-full-116").hide();
}

Can you just have a <div id="post-116">Content</div> and add something like class="full" if its the full size version. If you go from preview to full size view you just find the element with id="post-116" and replace the contents and add the attribute. If you go from full size view to preview then find the div again and replace the contents and remove the class.


Need Your Help

Running jacocoReport

java scala gradle jacoco

I'm using gradle 1.7 and jacoco plugin.

Rails: How to print error message with Ajax Jquery?

ruby-on-rails ruby-on-rails-3 jquery

Currently, this is the code I have for creating a new message:

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.