I have Two dropdown such as Item and Product. When I select Item, respective product will be shown in other drodown from database. And I want to save such Item ID and Product ID in other table. Please help me. (raw php, mysql, javascript)
if(isset($_POST['submit'])){
$sales = htmlspecialchars(stripslashes(trim($_POST['sales'])));
$regionID = htmlspecialchars(addslashes(trim($_POST['cat'])));
$branchID = htmlspecialchars(addslashes(trim($_POST['subcat'])));
if($sales){
$insert = mysql_query("INSERT INTO dailycollection VALUES('', '$regionID', '$branchID', '$sales')");
}
else{
$msg = "Please fillup all required fields!";
}}
Here is simple example.... which describe how to retrive product list dyanmically in drop down through item id using ajax....
<select id="item_id" name="item_id">
<option value="1">Item_1</option>
<option value="2">Item_2</option>
<option value="3">Item_3</option>
<option value="4">Item_4</option>
</select>
<select name="product_id" id="product_id">
</select>
<script type="text/javascript">
$(document).ready(function(){
$('#item_id').change(function(e){
e.preventDefault();
var item_id= $(this).val();
$.post('product.php',{item_id:item_id},function(res){
$('#product_id').html(res);
});
})
});
</script>
/** product.php **/
$item_id = $_POST['item_id'];
$sql="SELECT product_id, product_name FROM product where item_id='".$item_id."'";
$result=mysql_query($sql);
if(mysql_num_rows($result)>0){
while($line=mysql_fetch_array($result)){
$str .='<option value="'.$line['product_id'].'">'.$line['product_id'].'</option>';
}
}else{
$str='no record';
}
echo $str; exit;
Let me preface this answer with my understanding of your question: you have two side-by-side dropdown menus. Picking an option in one will cause the related option in the other to become the current option. Based on your tags, it looks like you're building the full stack. That's good- this'll be a great learning experience for you.
Let's look at what I see as a possible solution for you, back to front, iterating once or twice as we build familiarity with the systems.
The bottom layer here is your MySQL database (I'll assume for the time being that this is already built, so if it isn't, let me know and I'll add some relevant info to this answer). Your site interacts with this database through PHP, or, more specifically, through the PHP MySQL Improved Extension (http://php.net/manual/en/book.mysqli.php).
The first PHP script you're going to need is one that gets data from the database. I'll throw down some example code line by line and explain what everything does.
$itemID = $_POST["itemID"];
We'll learn in a minute that this is the data associated with a POST request to our script. We'll use this to tell our database which row we're looking for.
$mydatabase = new mysqli("databaseserver.com", "mysqlusername",
"mysqlpassowrd", "databasename");
This line establishes a connection between your site (server-side, not client) and your database server. If they're hosted on the same machine, and MySQL is running on the localhost, you can put localhost as your database server location.
Next, I suggest you check the PHP documentation for error handling functions. I don't want to get too granular here.
After that, perform your query.
$result = $mydatabase->query("SELECT * FROM mytable WHERE itemID = " . strval($itemID));
Here, $result is of the data type "MySQLi Result." There's more error handling you can do with this, but the next basic step is turning your result into more friendly data. A row's data can be turned into a PHP associative array like so:
$row = $result->fetch_assoc();
There are plenty of other options here, so check the docs if this method doesn't cut it for you. Before you "return" this data with an echo, you'll need to parse it into a more useful form. For example, if your MySQL table that you queried just had one column of type INTEGER and it contained the product ID, you could likely get away with $data = $row["productID"].
VERY IMPORTANT NOTE: Poorly configured PHP is one of the most common vulnerabilities on the web, particularly where POSTs are involved (more on that below). Please read the docs and make sure you're taking all relevant precautions here. If you copy and paste my example from above, you will be vulnerable to SQL injection.
Moving up a layer, you need to get this data to your client-side script (read javascript). To see how this is done, we need to back up a step and see how the original request was performed. I recommend using jQuery for this; it's easy, it's popular, and it's well documented.
To run that PHP script we just talked about in the first place, you'll need to perform some sort of request. Based on the nature of this setup, it's looking like it'll be a POST. A POST looks a little something like this in jQuery:
$.post("grabdata.php", {"item":$('#itemID').val()}, function(response){
console.log(response);
document.mydata = response;
}
This function will print the last echo of grabdata.php to the console then save the response as a property of your document object (basically makes it globally accessible). There are better ways to do this that keep your global space cleaner, but this does the trick for my simple example. That middle chunk there between is the data you're "posting" to grabdata.php. In your case, you wanted to get a product ID given a certain item ID (?) and vice-versa. This is an example of a one-way version of that. Check http://api.jquery.com/jQuery.post/ for more detail.
Top layer: display. This last part is pretty straight forward. Now that you have your product ID stored in document.mydata, all you have to do is a quick value update with jQuery:
$('#productID').val(document.mydata);
Please do keep in mind that I've skimmed over a lot of fine details here. I just meant to give an overview of how a system like this works. Please read the docs I linked to and come back soon with more specific questions.
Good luck!