On my PHP page, I have implemented a jQuery script to open a dialog window. The code for this is as follows:
<script type="text/javascript">
$(document).ready(function() {
var $loading = $('<img src="loading.gif" alt="loading" class="loading">');
$('#data-specs a').each(function() {
var $dialog = $('<div></div>')
.append($loading.clone());
var $link = $(this).one('click', function() {
$dialog
.load($link.attr('href'))
.dialog({
title: '<?php echo $_GET["indQ"];?>',
modal: true,
width: 500,
height: 300,
minHeight: 300,
maxHeight: 600,
minWidth: 500,
maxWidth: 800
});
$link.click(function() {
$dialog.dialog('open');
return false;
});
return false;
});
});
$('#dav').val(getURLParameter('davQ'));
$('#pathogen').val(getURLParameter('pathogenQ'));
$('#topicF').val(getURLParameter('topicQ'));
$('#ind').val(getURLParameter('indQ'));
$('#subind').val(getURLParameter('subindQ'));
$(".selfont").change(function (event) {
window.location = '?davQ=' + $('#dav').val() + '&pathogenQ=' + $('#pathogen').val() + '&topicQ=' + $('#topicF').val() + '&indQ=' + encodeURIComponent($('#ind').val()) + '&subindQ=' + encodeURIComponent($('#subind').val());
});
function getURLParameter(name) {
return decodeURIComponent((RegExp(name + '=' + '(.+?)(&|$)').exec(location.search) || [, null])[1]);
}
});
</script>
The data is displayed in a table with the id 'data-specs' and everything works smoothly. However, when I added a dropdown box with sorting values using an AJAX script, it caused an issue. After the AJAX call for sorting, clicking the link to open the dialog window opens it in the parent window instead. If I press the back button on the browser and then click the link again, the dialog window opens without any errors. How can I resolve this even after sorting is done using AJAX? Please provide me with some solutions. The AJAX code for sorting is shown below:
function ajaxFunction(){
//to keep selection in countryList - GP
var ref = document.getElementById('countryRF');
for(i=0; i<ref.options.length; i++)
ref.options[i].selected = true;
var ajaxRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
//document.myForm.time.value = ajaxRequest.responseText;
document.getElementById("result").innerHTML=ajaxRequest.responseText
}
}
var dav = document.getElementById('dav').value;
var pathogen = document.getElementById('pathogen').value;
var topicF = document.getElementById('topicF').value;
var ind = document.getElementById('ind').value;
var subind = document.getElementById('subind').value;
var selObj = document.getElementById('countryRF');
var cnty = loopSelected(selObj).join('~'); // join array into a string
var sortby = document.getElementById('sortby').value;
var queryString = "?dav=" + dav + "&pathogen=" + pathogen + "&topicF=" + topicF + "&ind=" + encodeURIComponent(ind) + "&subind=" + encodeURIComponent(subind) + "&cnty=" + encodeURIComponent(cnty) + "&sortby=" + sortby;
ajaxRequest.open("GET", "sortbyD.php" + queryString, true);
ajaxRequest.send(null);
return false;
}
Please assist me in resolving this issue.