SamarLover
SamarLover

Reputation: 182

jquery .get problem

i have this html ul code

<ul>
  <li> <a href='#' class='approch' alt='1' > 111111 </a> </li>
  <li> <a href='#' class='approch' alt='2' > 222222 </a> </li>
  <li> <a href='#' class='approch' alt='3' > 333333 </a> </li>
  <li> <a href='#' class='approch' alt='4' > 444444 </a> </li>
  <li> <a href='#' class='approch' alt='5' > 555555 </a> </li>
  <li> <a href='#' class='approch' alt='6' > 666666 </a> </li>
  <li> <a href='#' class='approch' alt='7' > 777777 </a> </li>
</ul>

Now I want to make this

when user click on any hyper link i make alt for it contain id number

J Query should take this id and send get request to File and load html code

The Problem Is How to add the answer code from file after the li he click on it

mean if i clicked the first link

<ul>
  <li> <a href='#' class='approch' alt='1' > 111111 </a> </li>
  **My Loaded code should apper here**
  <li> <a href='#' class='approch' alt='2' > 222222 </a> </li>
  <li> <a href='#' class='approch' alt='3' > 333333 </a> </li>
  <li> <a href='#' class='approch' alt='4' > 444444 </a> </li>
  <li> <a href='#' class='approch' alt='5' > 555555 </a> </li>
  <li> <a href='#' class='approch' alt='6' > 666666 </a> </li>
  <li> <a href='#' class='approch' alt='7' > 777777 </a> </li>
</ul>

Upvotes: 0

Views: 170

Answers (4)

voigtan
voigtan

Reputation: 9031

something like:

$("a").load(url, function(data) {
    $(this).parent().after(data);
});

if you are using the a-elements href as url source you can do it like: http://jsbin.com/uvipaj/edit

Upvotes: 2

Drake
Drake

Reputation: 3891

$(".approach").click(function(e){
    e.preventDefault();

    $.get("http://yourwebsite.com/yourfile.php?id=" + $(this).attr("alt"), function(data){
        $(this).parent().insertAfter(unescape(data));
    });
});

sounds about right

Upvotes: 4

JSantos
JSantos

Reputation: 1708

You can use something like this:

$('a').click(function() {
   $(this).parent().append('<br>'+$(this).attr("alt"));
});

example

You would need to tweak it to fit your needs, but I think the best method should be to create a div bellow every li and fill it with the text you want

Upvotes: 0

Neil
Neil

Reputation: 5782

$('.approch').click(function() {
    var id = $(this).attr('alt');
    var newli = '<li></li>';
    $(this).closest('li').after(newli);
    newli.load('/file.html');
});

Upvotes: 0

Related Questions