IDs in HTML are unique. You cannot have multiple elements with
id="removeSearchword".
You can use the CLASS attribute instead, or make unique IDs like:
id="removeSearchword_1", id="removeSearchword_2", ...
and then change your selector to:
$("[id^=removeSearchword_]").click(...);
On Jul 26, 10:04 am, Ayah <e...@eckan.be> wrote:
> Hello!
> Im trying to build a AJAX request with jQuery,
> the function should work like this.
> I have a list of words like this.
> [code]
> <ul id="searchword_ul">
> <li id="searchword_kuken">
> <?=form_open('adminpanel/testformremove')?>
> <div style="display:none">
> <?=form_input('sokord_id', '3', 'id="sokord_id"')?
>
> <?=form_input('register_id', '1',
> 'id="register_id"')?>
> <?=form_input('sokordet', 'kuken',
> 'id="sokordet"')?>
> </div>
> kuken <a href="" id="removeSearchword">x</a>
> <?=form_close()?>
>
> </li>
> <li id="searchword_test">
> <?=form_open('adminpanel/testformremove')?>
> <div style="display:none">
> <?=form_input('sokord_id', '3', 'id="sokord_id"')?
>
> <?=form_input('register_id', '1',
> 'id="register_id"')?>
> <?=form_input('sokordet', 'test',
> 'id="sokordet"')?>
> </div>
> test <a href="" id="removeSearchword">x</a>
> <?=form_close()?>
> </li>
> </ul>
> </div>
> [/code]
>
> and a Javascript like this
> [code]
> $("#removeSearchword").click(function(){
> var sokord_id = $("#sokord_id").val();
> var register_id = $("#register_id").val();
> var sokordet = $("#sokordet").val();
>
> $.post("<?=base_url()?>index.php/adminpanel/
> testformremove",
> { sokord_id: sokord_id, register_id: register_id },
> function(data){
> $("#searchword_"+ sokordet).slideUp
> ("normal", function() {
>
> $("#searchword_"+ sokordet).before('');
> });
> }
> );
> return false;
> });
> [/code]
>
> The problem im having, is that i can only press the "x" (remove) link
> on the first one, not on the next one. Nothing happens when i press
> the secound "x".
>
> Why is that?
