Hi all,
I've been working on populating a secondary combobox after selecting data in a primary one...
Let's say I select a customer from the first combobox.
And now I want the projects that belong to that customer to appear into a second combobox.
By now this is my main combobox:
<div>
<div id="elementFormulariEtiqueta">Client:</div>
<select id="elementFormulari" style="width: 300px; height: 30px" name="cbClient" onchange="onChangeClient(this.value)">
<option value="--- Select ---">--- Select---</option>
<option value="My first customer">My First Customer</option>
</select>
</div>
And this is the secondary combobox:
<div>
<div id="elementFormulariEtiqueta">Projecte:</div>
<select id="elementFormulari" style="width: 300px; height: 30px" name="cbProjecte" >
<option value="--- Select ---">--- Select ---</option>
</select>
</div>
As you can see the main combobox has an event onChange that points to onChangeClient function which is:
<pre><script>
function onChangeClient(client)
{
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function()
{
if (this.readyState == 4 && this.status == 200)
{
document.getElementById("cbProjecte").append(this.responseText);
}
};
xmlhttp.open("POST","temps_onChangeClient.php?q="+client,true);
xmlhttp.send();
}
</script>
At the bottom of my form I've added:
<p>Suggestions: <span id="txtHint"></span></p>
I've used this to be able to see what the temps_onChangeClient.php file returns.
Notice that, if I add
echo('return this'); and uncomment the
document.getElementById("txtHint").innerHTML = this.responseText; I can see the result after
"Suggestions:".
The temps_onChangeClient.php file obtains the q parameter, searches the database and returns the database query resulting row, but, in order to keep thingseasier, I've changed it for:
$arr[0] = '0';
$arr[0] = '1';
$arr[0] = '2';
$arr[0] = '3';
$arr[0] = '4';
$arr[0] = '5';
$arr[0] = '6';
echo($arr);
With my current data, when I select My first customer, I can see the result "Suggestions: Array" which tells me I'm getting an array (the names of the projects that belong to that customer). I'm getting also Array if I use the replacement to keep things easier I've shown before.
Now I need to add those results into the secondary combobox, but I don't know how to do it...
Searching information about this I'm seeing really strange JSON scripts which I don't understand.
Could you help me in this last step?
Thank you very much!
Old question:
I've never done that before, and I'm wayyyy lost.
I have a MySQL database and I'm making a small web page that should help me keep track of my working hours...
I'm doing that with PHP and MySQL.
My intention is to select a project (combobox 2) after selecting a customer (combobox 1).
I've seen some examples using Ajax.
But, before starting with something new... I've read in the Wikipedia smartphones can't cope with Ajax... (<a href="https://en.wikipedia.org/wiki/Ajax_(programming)">See the first one in Ajax drawbacks</a>[<a href="https://en.wikipedia.org/wiki/Ajax_(programming)" target="_blank" title="New Window">^</a>]).
I plan to start and stop my tasks from my phone so this would be needed...
How would you do it? given I'm working in PHP and MySQL... which would be the best option to be able to dynamically fill one combobox after selecting one option in another one?
As always, thank you very much!
:thumbsup:
What I have tried:
Searching examples, reading documentation, trying it...