Я создаю форму заказа с PHP и MySQL.
Форма PHP имеет поле ввода, в котором пользователь вводит код продукта. В случае, если пользователь не знает код продукта, я хочу, чтобы они нажимали на изображение или кнопку рядом с полем ввода, что открывает всплывающее окно со списком всех кодов продуктов. они могут затем щелкнуть по желаемому продукту и передать код продукта из всплывающего окна в поле ввода в этой строке таблицы.
У меня есть код моей страницы ниже и изображение создаваемой страницы, чтобы вы могли почувствовать, чего я хочу добиться.
родительская страница
<table border=0 id="hor-minimalist-a">
<tr>
<th valign=bottom>KVI</th>
<th valign=bottom>PACK CODE</th>
<th valign=bottom width=250>DESCRIPTION</th>
<th valign=bottom width=40>WHSE</th>
<th valign=bottom width=25>SU</th>
</tr>
<tr id="r1">
<td>
<input type=checkbox name=kvi1 id=kvi1 value=1>
</td>
<td>
<input size=10 type=number id=sku1 name=sku1 onchange="showUser(1, this.value)">
<input type="button" name="choice" onClick="window.open('sku.php','popuppage','width=400,toolbar=1,resizable=1,scrollbars=yes,height=400,top=100,left=100');" value="?">
</td>
<td>
<div align="left" id="txtHint1"> </div>
</td>
<td>
<div align="left" id="whse1"> </div>
</td>
<td>
<div align="left" id="su1"> </div>
</td>
</tr>
<tr id="r2">
<td>
<input type=checkbox name=kvi2 id=kvi2 value=2>
</td>
<td>
<input size=10 type=number id=sku2 name=sku2 onchange="showUser(2, this.value)"><img src=q.png>
</td>
<td>
<div align="left" id="txtHint2"> </div>
</td>
<td>
<div align="left" id="whse2"> </div>
</td>
<td valign=bottom>
<div align="left" id="su2"> </div>
</td>
</tr>
<tr id="r3">
<td>
<input type=checkbox name=kvi3 id=kvi3 value=3>
</td>
<td>
<input size=10 type=number id=sku3 name=sku3 onchange="showUser(3, this.value)"><img src=q.png>
</td>
<td>
<div align="left" id="txtHint3"> </div>
</td>
<td>
<div align="left" id="whse3"> </div>
</td>
<td>
<div align="left" id="su3"> </div>
</td>
</tr>
<tr id="r4">
<td>
<input type=checkbox name=kvi4 id=kvi4 value=4>
</td>
<td>
<input size=10 type=number id=sku4 name=sku4 onchange="showUser(4, this.value)"><img src=q.png>
</td>
<td>
<div align="left" id="txtHint4"> </div>
</td>
<td>
<div align="left" id="whse4"> </div>
</td>
<td>
<div align="left" id="su4"> </div>
</td>
</tr>
</table>
</form>
код всплывающей страницы и изображение ниже:
<?
$con = mysql_connect('localhost', 'dbuser', 'dbpass');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("databasename", $con);
$skusql="select packcode,category,description,grouping,packconfig,sellingunits,eottpoints from skudata order by category, packcode";
$resultsku=mysql_query($skusql);
?>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function sendValue (s){
var selvalue = s.value;
window.opener.document.getElementById('details').value = selvalue;
window.close();
}
// End -->
</script>
<form name="selectform">
<table border=0 width=1000 id="hor-minimalist-a">
<tr>
<th>Pack Code</th>
<th> </th>
<th>Category</th>
<th>Product Description</th>
<th>Grouping</th>
<th>Pack Config</th>
<th>SU</th>
<th>Points</th>
</tr>
<?php
while($rows=mysql_fetch_array($resultsku)){
?>
<tr>
<td><input name=details size=5 value="<?php echo $rows['packcode']; ?>"></td>
<td><input type=button value="Select" onClick="sendValue(this.form.details);"</td>
<td><?php echo $rows['category']; ?></td>
<td><center><?php echo $rows['description']; ?></td>
<td><center><?php echo $rows['grouping']; ?></td>
<td><center><?php echo $rows['packconfig']; ?></td>
<td><center><?php echo $rows['sellingunits']; ?></td>
<td><center><?php echo $rows['eottpoints']; ?></td>
</tr>
<?php
}
?>
</table>
Я пытаюсь передать значение кода продукта из выбранной строки всплывающего окна, в поле ввода родительского окна для "кода пакета"
Я пытался адаптировать script, с которым я столкнулся, но я не отключаю его. Любая помощь ценится, как всегда!
С уважением, Райан
ОБНОВЛЕНИЕ К ВОПРОСУ:
РОДИТЕЛЬСКАЯ СТРАНИЦА:
<html>
<head>
<title>Unilever Sales Portal</title>
<style>
@import url("style.css");
</style>
<script type="text/javascript">
function showUser(userNumber, str)
{
if (str=="")
{
document.getElementById("txtHint" + userNumber).innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//document.getElementById("txtHint" + userNumber).innerHTML=xmlhttp.responseText;
var responseText = xmlhttp.responseText;
var description = responseText;
var warehouse = "";
var sellingUnits = "";
if (responseText.indexOf("NOT A VALID") == -1)
{
description = responseText.substring(12, responseText.indexOf(",Warehouse:"));
warehouse = responseText.substring(responseText.indexOf(",Warehouse:")+11, responseText.indexOf(",SellingUnits:"));
sellingUnits = responseText.substring(responseText.indexOf(",SellingUnits:")+15);
}
document.getElementById("whse" + userNumber).innerHTML = warehouse;
document.getElementById("txtHint" + userNumber).innerHTML = description;
document.getElementById("su" + userNumber).innerHTML = sellingUnits;
}
}
xmlhttp.open("GET","getdata1.php?q="+str,true);
xmlhttp.send();
}
</script>
<script type="text/javascript">
function selectValue(id)
{
// open popup window and pass field id
window.open('sku.php?id=' + encodeURIComponent(id),'popuppage',
'width=400,toolbar=1,resizable=1,scrollbars=yes,height=400,top=100,left=100');
}
function updateValue(id, value)
{
// this gets called from the popup window and updates the field with a new value
document.getElementById(id).value = value;
}
</script>
</head>
SKU.PHP
<?
$con = mysql_connect('localhost', 'dbuser', 'dbpass');
if (!$con)
{
die('Could not connect to server: ' . mysql_error());
}
$db=mysql_select_db("dbname", $con);
if (!$db)
{
die('Could not connect to DB: ' . mysql_error());
}
$sql="select packcode,category,description,grouping,packconfig,sellingunits,eottpoints from skudata order by category, packcode";
$result=mysql_query($sql);
?>
<script type="text/javascript">
function sendValue(value)
{
var parentId = <?php echo json_encode($_GET['id']); ?>;
window.opener.updateValue(parentId, value);
window.close();
}
</script>
<form name="selectform">
<table border=0 width=1000 id="hor-minimalist-a">
<tr>
<th>Pack Code</th>
<th> </th>
<th>Category</th>
<th>Product Description</th>
<th>Grouping</th>
<th>Pack Config</th>
<th>SU</th>
<th>Points</th>
</tr>
<?php
while($rows=mysql_fetch_array($result)){
?>
<tr>
<td><input name=details size=5 value="<?php echo $rows['packcode']; ?>"></td>
<td><input type=button value="Select" onClick="sendValue(this.form.details);"</td>
<td><?php echo $rows['category']; ?></td>
<td><center><?php echo $rows['description']; ?></td>
<td><center><?php echo $rows['grouping']; ?></td>
<td><center><?php echo $rows['packconfig']; ?></td>
<td><center><?php echo $rows['sellingunits']; ?></td>
<td><center><?php echo $rows['eottpoints']; ?></td>
</tr>
<?php
}
?>
</table>
Вот изображения, показывающие работу. родительская страница:
Всплывающая страница:
Родительская страница после всплывающего окна
Еще раз спасибо за помощь. С Уважением, Райан