将获取的数据从一个div发送到另一个div

时间:2013-04-07 18:49:29

标签: php javascript mysql ajax

这是使用php和ajax

从mysql数据库中检索名称的代码

更新代码

的index.php

    <html>
<head>
<script language="javascript">
    function showresult()
    {  
    var product_name = document.getElementById("searchval").value;   
    if(window.XMLHttpRequest)
    {
    XMLHttpRequestObject = new XMLHttpRequest();
    }
    else if(window.ActiveXObject)
    {
    XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
    }  
     XMLHttpRequestObject.open("POST", "search.php", true);   
     XMLHttpRequestObject.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");                    
     XMLHttpRequestObject.send("search_res=" + product_name);  
     XMLHttpRequestObject.onreadystatechange = function()  
    {  
        if(XMLHttpRequestObject.readyState == 4)
        {
            if(XMLHttpRequestObject.status == 200)
            {
                document.getElementById("displayresult").innerHTML = XMLHttpRequestObject.responseText;
            }
        }

    }  
    }
function throwval(obj)
{
    var sent_id = obj.id;
var v = document.getElementById(sent_id).value;
    var newp = document.createElement("p");     
var text = document.createTextNode(v);
newp.appendChild(text);
document.getElementById("getselected").appendChild(newp);  
}
function sendvalues()
{

var div_val = document.getElementById("getselected");
var str="|";
    for (i=0; i < div_val.getElementsByTagName("p").length; i++)
    {
    var paragraphs = div_val.getElementsByTagName("p");
    var pvalues = paragraphs.item(i).innerHTML;
str = str + pvalues + "|";
}   
window.location="send_data.php?str="+str;
}

    </script>
    </head>
    <body>
    <form method="post" name ="searchform" id="idsearchform" >
    <input type="text" name="search" id="searchval"/>
    <input type="button" name="starts" value="startsearch" onclick="showresult()"/>
    </form>
    <div id="displayresult">

    </div>
    <div id="getselected">
    Selected :
    </div>
    <form name="sendf" method="post" action="send_data.php">
    <input type="button" id="sendtophp" name="sendingval" value="next step" onclick="sendvalues()">
    </form>
    </body>
    </html>

的search.php

$mysql_con = mysql_connect("localhost","root","") or die("Could not   connect".mysql_error());
$mysql_db = mysql_select_db("test",$mysql_con) or die("Unable to select db  ".mysql_error());
$keyword = mysql_real_escape_string($_POST['search_res']);
$search_q = mysql_query("Select * from products where pname like '%$keyword%'");
if(mysql_num_rows($search_q)!=0)
{
    while($result = mysql_fetch_array($search_q))
    {
        $name = $result['pname'];
        echo "<input type='button' name='resultname' id='$productid' value='$name' onclick='throwval(this)'><br/>";
    }
}

send_data.php

<?php
$url = $_SERVER['REQUEST_URI'];
$exploded = explode('|',$url,-1);
$number = count($exploded);
?>
<html>
<body>
<table align="center" border="1">
<form method="post" action="send_data.php">
<tr>
<td>Name</td>
<td>Quantity</td>
</tr>
<?php
for($i=1;$i<$number;$i++)
{
    $p_name = $exploded[$i];
?>
<tr>
<td><input type="text" name="p_names" value="<?php echo $p_name; ?>" /></td>
<td><input type="text" name="quantity" /></td>
</tr>
<?php 
}
?>
<tr>
<td></td>
<td><input type="submit" name="send_request" value="Submit" /></td>
</tr>
</form>
</table>
</body>
</html>

我想将所选结果发送到另一个div,我可以使用php或javascript(no jquery)将所选值发送到另一个文件。 我怎么能这样做。

更新:我已经使用appendchild成功地将数据从一个发送到另一个。我现在的问题是我添加的值被添加为单个字符串。我希望每个值都是独立的,这样我就可以将它发送到php(有点像购物车)。有任何想法吗? 感谢

我设法通过为每个选定的值创建一个新的p属性,使用javascript发送单独的值。我现在可以在send_data.php中显示值,但我不知道如何通过一个表单发送for循环生成的多个值。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我知道您正在尝试构建搜索表单。用户可以进行多次搜索。用户可以从每个搜索请求中选择结果。每个选定的结果存储在某处,并在用户完成搜索和选择后发送到另一个PHP脚本。

我会在HTML中添加一个隐藏字段,不仅可以将结果附加到DIV,还可以将结果附加到隐藏字段的值。假设用户选择productId 1,3,5隐藏字段的值将为“1,2,3”。在PHP中,您可以爆炸字符串并将每个元素转换为int,并随意执行任何操作。

这种方法假定用户在完成搜索和选择后点击某种“我完成按钮”,这样您就可以将带有隐藏字段的表单提交给服务器。

另一种方法是在用户选择一个值后立即使用Ajax请求将所选值发送回服务器。