Databases
StackOverflow2013
Postsdbo
POHow to create a Jquery slideLeft delete for list item?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to create a Jquery slideLeft delete for list item?
    text
    copied!<p>Hi I am trying to create a page loading my image, content, and the delete option. The image url and content are output from database. What I want to need is that on clicking of the delete the image, it would render animation to slide left showing the the image has been removed. My code so far ...</p> <p>Jquery Script:</p> <pre><code>$(function() { $("#sortable").sortable(); $('a.delete').click(function(e) { e.preventDefault(); var parent = $(this).parent(); $.ajax({ type: 'get', url: 'jquery-record-delete.php', data: 'ajax=1&amp;delete=' + parent.attr('id').replace('record-',''), beforeSend: function() { parent.animate({'backgroundColor':'#fb6c6c'},300); }, success: function() { //parent.slideUp(300,function() { // replaced with following parent.animate({left: '100px'}, 300, function() { parent.remove(); }); } }); }); }); </code></pre> <p>Query;</p> <pre><code>if(isset($_GET['delete'])) { mysql_select_db($database_conn_foliodb, $conn_foliodb); $query_rs_text = 'DELETE FROM text WHERE text_id = '.(int)$_GET['delete']; $result = mysql_query($query_rs_text, $conn_foliodb) or die(mysql_error()); } mysql_select_db($database_conn_foliodb, $conn_foliodb); $query_rs_images = 'SELECT * FROM text ORDER BY text_id ASC'; $rs_images = mysql_query($query_rs_images, $conn_foliodb) or die(mysql_error()); $row_rs_images = mysql_fetch_assoc($rs_images); </code></pre> <p>Body Output:</p> <pre><code>&lt;div class="demo"&gt; &lt;ul id="sortable"&gt; &lt;?php do { echo '&lt;li class="record" id="record-'.$row_rs_images['text_id'].'"&gt;&lt;table&gt;&lt;tr&gt;&lt;td&gt; &lt;strong&gt;'.$row_rs_images['content'].'&lt;/strong&gt; &lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td&gt;&lt;img src="'.$row_rs_images['img'].'" width="100" height="100" /&gt;&lt;tr&gt;&lt;td&gt; &lt;tr&gt;&lt;td&gt;&lt;a href="?delete='.$row_rs_images['text_id'].'" class="delete"&gt;Delete&lt;/a&gt;&lt;tr&gt;&lt;td&gt; &lt;/table&gt;&lt;/li&gt;'; } while($row_rs_images = mysql_fetch_assoc($rs_images)) ?&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>Thank you very much.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload