I want to run jQuery when select element change and when page load. In this web page I have two table which user can move row from tbl1 to table2 using jQuery and every thing work fine but when I run the jQuery when select change and page load I can not move row from one table to another this is the code which I wish to run when page load and select is change
<script>
$(document).ready(function () {
$('#Groups').change(function () {
// show that something is loading
//$('#result').html('<img src="images/ajax_loader_red_128.gif"/>')
var jtarih = $('#Groups').val();
// alert(jtarih);
//var jadsoyad=$('#adsoyad').val();
/*
* 'post_receiver.php' - where you will pass the form data
* $(this).serialize() - to easily read form data
* function(data){... - data contains the response from post_receiver.php
*/
$.post('groupuser.php', {id: jtarih, tarih: jtarih}, function (data) {
$('#dive').html(data);
// show the response
// $('#dive').replaceWith(html(data));
}).fail(function (data) {
// just in case posting your form failed
$('#dive').html(data);
});
// to prevent refreshing the whole page page
return false;
});
$('#Groups').trigger('change');
});
</script>
This is the JavaScript code which move row from one table to another in this code every thing go fine but when I run the above JavaScript code onload page this code not working
<script>
$(document).ready(function () {
$("#product-table2 img.move-row").live("click", function () {
var tr = $(this).closest("tr").remove().clone();
tr.find("img.move-row")
.attr("src", "images/arrow.png")
.attr("alt", "Move");
$("#product-table tbody").append(tr);
});
$("#product-table img.move-row").live("click", function () {
var tr = $(this).closest("tr").remove().clone();
tr.find("img.move-row")
.attr("src", "images/leftarrow.png")
.attr("alt", "Remove");
$("#product-table2 tbody").append(tr);
});
});
</script>