Ajax and PHP resending request after results have been written - php

Question

I am a beginner in ajax and on very short deadline so I am turning to this community for help.
My problem is:
When I successful make ajax request and the results are returned I cant select another value. I will try to explain below.
I have a PHP page with search form that contains 4 dropdowns and a submit button. Goal is to set the search parameters by selecting a values from dropdowns. When you select the first value, all the others must change values according to selected value.
For example: I have a dropdowns named:
Destination, Month, Port and Ship
When you select the Destination then all the other dropdowns are rewritten in manner that correspond to the destination. So when I have this the Destination is a single, now I want to select witch month, or port or Ship I want to use and so on.
I hope you understand.
EDITED: It seems it is not the problem with ajax but with Jquery event not fiering up after ajax returns values.
The code I have is:
Ajax:
<script>
var xmlhttp;
function showUser(dest,mese,port,ladja)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url="remote.php";
url=url+"?dest="+dest+"&mese="+mese+"&port="+port+"&ladja="+ladja;
url=url+"&sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("content").innerHTML=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>
PHP
<div id="src">
<div id="main">
<div id="content">
<form name="src" id="src_form" method="post" action="result.php">
<div id="lin1" class="lin"><?php Destinacija(); ?></div>
<div id="lin2" class="lin"><?php Mesec(); ?></div>
<div id="lin3" class="lin"><?php Pristanisce(); ?></div>
<div id="lin4" class="lin"><?php Ladja(); ?></div>
<div id="lin5"><button id="src" type="submit">Išči</button></div>
</form>
</div>
</div>
</div>
<script>
$("#content").on("change", ".lin", function(event){
event.preventDefault();
//console.log( $( this ).text() );
showUser(document.getElementById('dest').value,document.getElementById('mese').value,document.getElementById('port').value,document.getElementById('ladja').value);
});
</script>
<?php include("ajax.php"); ?>
<?php
function Destinacija()
{
include("class/class.Translate_inl.php");
$tr = new Translate_inl("dest_code");
include("includes/conSql.php");
$result = mysqli_query($con,"SELECT DISTINCT region_code FROM no_air_pricing");
echo '<select name="dest" id="dest">'.PHP_EOL;
echo '<option value="0">Destinacija</option>'.PHP_EOL;
while($row = mysqli_fetch_array($result))
{
$dest = $tr->TrVar($row['region_code']);
echo'<option value="'.$row['region_code'].'">'.$dest.'</option>'.PHP_EOL;
}
echo '</select>'.PHP_EOL;
include("includes/disSql.php");
}
function Mesec()
{
$tr = new Translate_inl("meseci");
include("includes/conSql.php");
$mo = array();
$i=0;
$result = mysqli_query($con,"SELECT sail_date FROM no_air_pricing ORDER BY sail_date");
while($row = mysqli_fetch_array($result))
{
$month = explode("/",$row['sail_date']);
$mo[$i] = $month[0];
$i++;
}
include("includes/disSql.php");
$un_mo = array_unique($mo);
$un_mo = array_values($un_mo);
$k = count($un_mo);
echo'<select name="mese" id="mese">'.PHP_EOL;
echo'<option value="0">Mesec odhoda</option>'.PHP_EOL;
for($j=0; $j<$k; $j++)
{
echo'<option value="'.$un_mo[$j].'">'.$tr->TrVar($un_mo[$j]).'</option>'.PHP_EOL;
}
echo'</select>'.PHP_EOL;
unset($tr);
}
function Pristanisce()
{
$tr = new Translate_inl("port_code");
$port = array();
$i=0;
include("includes/conSql.php");
$result = mysqli_query($con,"SELECT departure_port_code FROM no_air_pricing ORDER BY departure_port_code");
while($row = mysqli_fetch_array($result))
{
$port[$i] = $row['departure_port_code'];
$i++;
}
include("includes/disSql.php");
$uport = array_unique($port);
$uport = array_values($uport);
$k = count($uport);
echo '<select name="port" id="port">'.PHP_EOL;
echo '<option value="0">Pristanišče odhoda</option>'.PHP_EOL;
for($j=0; $j<$k; $j++)
{
echo'<option value="'.$uport[$j].'">'.$tr->TrVar($uport[$j]).'</option>'.PHP_EOL;
}
echo '</select>'.PHP_EOL;
unset($tr);
}
function Ladja()
{
$tr = new Translate_inl("ladje_kode");
$ladje = array();
$i=0;
include("includes/conSql.php");
$result = mysqli_query($con,"SELECT ship_code FROM no_air_pricing ORDER BY ship_code ");
while($row = mysqli_fetch_array($result))
{
$ladje[$i] = $row['ship_code'];
$i++;
}
include("includes/disSql.php");
$uladje = array_unique($ladje);
$uladje = array_values($uladje);
$k = count($uladje);
echo '<select name="ladja" id="ladja">'.PHP_EOL;
echo '<option value="0">Ladja</option>'.PHP_EOL;
for($j=0; $j<$k; $j++)
{
echo'<option value="'.$uladje[$j].'">'.$tr->TrVar($uladje[$j]).'</option>'.PHP_EOL;
}
echo '</select>'.PHP_EOL;
unset($tr);
}
?>
Any help would be welcome. Thanks in advance.
I have edit the script code in php file, to implement the answer from Musa.
Still need help the original problem still stends.

Answer 1

Solved the problem.
I have puted:
$.ajaxSetup({
url: "remote.php",
global: true,
type: "POST"
});
before my ajax script and it fired up. Pleas don't ask me why, it just works ;)
Thank you for all the answers.