jquery is not working after ajax call
[quote author=piyush23424 link=topic=286276.msg1357425#msg1357425 date=1265034430]
Hello..
jquery function is not working after the ajax call,
i am using jquery function to hide show the div and sorting the the divs(records div id is contentLeft ) in the listing and ajax is used to show the listing 'by order'() (one drop down with options and two radio buttons for asc and desc order)
link name 'adjustments' is activating the hide/show div functionality
[code]
<script type="text/javascript">
$(document).ready(function(){
$(function() {
$("#contentLeft").sortable({ opacity: 0.6, cursor: 'move', update: function() {
var order = $(this).sortable("serialize") + '&action=updateRecordsListings';
$.post("http://localhost/CodeIgniter/index.php/cma/updateRecord", order, function(theResponse){
$("#contentRight").html(theResponse);
});
}
});
});
// hides the slickbox as soon as the DOM is ready
// (a little sooner than page load)
$('.slickbox1').hide('slow');
// shows the slickbox on clicking the noted link
// toggles the slickbox on clicking the noted link
$('a.slick-toggle').click(function() {
var id = $(this).attr('id');
$('#slickbox'+id).toggle(400);
return false;
});
//ajax call from jquery
});
function get_record_id(key)
{
var xmlhttp = GetXmlHttpObject();
var value;
var key = key;
if(key=='ASC' || key=='DESC'){
value = document.getElementById('sort_key').value;
var param = "orderby="+key+"&value="+value;
}
else
{
value = key;
for(i=0; i<document.sortform.sort_order.length; i++)
{
if(document.sortform.sort_order[i].checked==true)
{
var orderby = document.sortform.sort_order[i].value;
}
}
var param = "orderby="+orderby+"&value="+value;
}
if(xmlhttp==null)
{
alert ("Your browser does not support XMLHTTP!");
return;
}
var url="http://localhost/CodeIgniter/index.php/cma/sortacs";
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("POST",url,true);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.send(param);
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("contentLeft").innerHTML=unescape(xmlhttp.responseText);
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
}
</script>
<form name="sortform">
<span>
<strong>Organize listings by:</strong>
<select name="sort_key" id="sort_key" onchange="get_record_id(this.value)">
<option value=""></option>
<option value="status" selected="selected">Status</option>
<option value="bedrooms">Beds</option>
<option value="baths_total">Baths</option>
<option value="price">List Price</option>
<option value="price">Price</option>
<option value="total_sq_ft">Square Feet</option>
</select>
</span>
<input id="record_id" type="radio" name="sort_order" value="ASC" onclick="get_record_id(this.value);" />
Ascending
</span>
<span>
<input id="record_id" type="radio" name="sort_order" value="DESC" onclick="get_record_id(this.value);" />
</span> <span id="loading" style="display: none; margin-left: 20px;">
<img alt="" src="assets/loading.gif" height="16" width="16"> Loading...
</span>
</form>
<?php
$i =1;
$active =0;
$pending=0;
$sold = 0;
$orderinfo = $this->session->userdata('orderinfo');
foreach($data as $row)
{
?>
<div class="module" id="recordsArray_<?php echo $row['id']; ?>">
<div class="listing">
<?php
switch($row['status']){
case 'Active':
$a = 'A';
$active += 1;
?>
<div class="list-status active">A</div>
<?php
break;
case 'Pending':
$a= 'P';
$pending += 1;
?>
<div class="list-status pending">p</div>
<?php
break;
case 'Sold':
$a = 'S';
$sold += 1;
?>
<div class="list-status closed">S</div>
<?php
break;
default:
$a="";
}
?>
<div class="address">
<p>
<strong>
<?php echo $row['address'] ?>
</strong>
</p>
</div>
<div class="sort-order">
<p class="key">
<?php
switch($orderinfo){
case 'status':
echo 'status';
$orderInfoValue = $a;
break;
case 'price':
echo "Price List";
$orderInfoValue = $row['price'];
break;
case 'total_sq_ft':
echo "Area";
$orderInfoValue = $row['total_sq_ft'];
break;
case 'bedrooms':
echo "Beds";
$orderInfoValue = (int)$row['bedrooms'];
break;
case 'baths_total':
echo "Baths";
$orderInfoValue = (int)$row['baths_total'];
break;
default:
$orderInfoValue = '';
}
?>
</p>
<p class="value"><?=$orderInfoValue;?></p>
</div>
<div class="price">
<p>
<span title="<?php echo $row['price']; ?>">
<?php echo "$".$row['price']; ?>
</span>
</p>
<p>
<a id="<?=$i?>" class="slick-toggle" href="#">Adjustments</a>
</p>
</div>
<div class="slickbox1" id="slickbox<?=$i?>" style="display:none; min-height:200px;">
this is the toggle div
</div>
</div>
</div>
<?php
$i++;
}
?>
[/code]
[/quote]