jQuery + AJAX çapa çalışmıyor silmek

1 Cevap php

Merhaba jQuery ve Codeigniter kullanıyorum. Ben ajax kullanarak silme girişleri ekleyebilirsiniz basit yapılacaklar listesi oluşturma.

Sorun benim silme çapa üzerine tıkladığınızda, bu girdiyi silin etmeyecek. Giriş özelliğinin eklenmesi BTW çalışır.

İşte benim kod:

todo_view.php

<html>
    <head>Todo List</head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
    	$(document).ready(function() {
    		$('#submit').click(function() {

    			var msg = $('#message').val();

    			$.post("<?= site_url('todo/add') ?>", {message: msg}, function() {
    				$('#content').load("<?= site_url('todo/view/ajax') ?>");
    				$('#message').val('');
    			});
    		});

    		$('a.delete').click(function() {
    			var id = $('input', this).val();
    			$.post("<?= site_url('todo/delete') ?>", {todoid: id}, function() {
    				$('#content').load("<?= site_url('todo/view/ajax') ?>");
    			});
    		});

    	});
    </script>
    <body>
    	<div id="form">
    		<input type="text" name="message" id="message" />
    		<input type="submit" name="submit" id="submit" value="Add todo" />
    	</div>
    	<div id="content">
    		<?php $this->load->view('message_list'); ?>
    	</div>
    </body>
</html>

message_list.php

<ol>
    <?php foreach ($todolist as $todo): ?>
    	<li>
    	<?php echo $todo->todo; ?> 
    	<a href="#" class="delete"><input type="hidden" value="<?=$todo->todoid ?>" />delete</a></li>
    <?php endforeach; ?>
</ol>

Neden çalışmıyor?

1 Cevap

Birincisi ve en önemlisi - GET / POST başlıklarını izlemek ve Firebug (Firefox için bir uzantısı) kullanmaya başlamalısınız değerleri için. Gerçekten hata ayıklama ajax çağrıları ve cevapları bakımından hayatınızı kolaylaştırır.

(Biraz Alimango sözü ne hatlarda) Sonraki ... en olası nedeni, ana sayfanın DOM zaten yüklü SONRA mesaj listesi yükleniyor olmasıdır. jQuery daha sonra otomatik olarak eklenen elemanları click olayı bağlamak olmaz. Rutin bağlama tıklama ileti listesi DOM eklenmiştir SONRA çağrılacak vardır. Liste alınıyor gibi / dinamik değişmiş Şimdi bu ... her zaman mümkün değildir.

Bir çözüm live() bind event function that has been introduced since jQuery 1.3 kullanmaktır. Eşleşti elemanı - Bu all current - and future için (tıklama gibi) bir olay için bir işleyici bağlar yardımcı olur. Ayrıca özel olaylar bağlayabilirsiniz. Fore Daha fazla bilgi için, bkz: http://docs.jquery.com/Events/live#typefn

İkinci çözelti kullanmak, LiveQuery - a jQuery plugin which "utilizes the power of jQuery selectors by binding events or firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated." You can grab it from http://plugins.jquery.com/project/livequery

Cheers, miCRoSCoPiC^eaRthLinG