首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用Onsubmit从表单中调用Javascript

使用Onsubmit从表单中调用Javascript
EN

Stack Overflow用户
提问于 2015-07-31 08:50:32
回答 1查看 310关注 0票数 0

我是PHP和AJAX方面的新手,我遇到了麻烦,不知道如何解决。我正在创建此页面,该页面显示查询结果的记录集。有两页: getdata.php和phpajax.php。phpajax.php通过Javascript调用getdata.php。

我所做的:

  • 我设法通过使用按钮“尝试它”(使用静态值)来使它工作。

我想要的:

  • 如何使用“提交”按钮正确地显示数据(在我单击“提交”两次之后,数据会出现几秒钟,然后由于页面突然刷新而消失)?
  • 如何使用提交按钮将SELECT和TEXT的值传递给fshowdata()
  • 如何使用“尝试”按钮将SELECT和TEXT的值传递给fshowdata()

下面是用于phpajax.php的内容:

代码语言:javascript
运行
复制
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

    <html>
   <head>
  <script>

  function fshowdata(str1,date1) {
    //alert("The form was submitted");
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
   } else { 
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML =      xmlhttp.responseText;
        }
    }
    //document.getElementById("demo").innerHTML = str1 + " " + date1;
    xmlhttp.open("GET","getdata.php?q="+str1+"&"+"t="+date1,true);

    xmlhttp.send();
}
}
</script>

<style>
table {
width: 100%;
border-collapse: collapse;
}

table, td, th {
border: 1px solid black;
padding: 5px;
}

th {text-align: left;}
</style>
</head>
<body>

<p id="demo">Click the button to change the text in this paragraph.</p>

<?php


$con = mysql_connect('localhost','root','123');
if (!$con) {
die('Could not connect: ' . mysql_error());
}

mysql_select_db('mydb')or die('Could not select database');
$sql="SELECT DISTINCT(rides) FROM t_trx ORDER BY rides ";
$result = mysql_query($sql) or die('Query failed: ' . mysql_error());



echo "<form onsubmit='"."fshowdata(`some rides`,`a date`)"."' action='".""."'>";
echo "Choose Rides : "." "."<select id='"."rides"."' name='"."rides"."'>";
echo "<option value='"."ALL"."'>ALL</option>";
while($row = mysql_fetch_array($result)) {
echo "<option value='".$row["rides"]."'>".$row["rides"]."</option>";
}
mysql_free_result($result);
echo "</select>";
mysql_close($con);

echo "<input id='"."date2"."' type='"."TEXT"."' name = '"."date2"."'>";
echo "<input id='"."button1"."' type='"."SUBMIT"."' value = '"."SUBMIT"."'>";
echo "</form>";


echo "<button onclick='"."fshowdata(`ROLLER COASTER`,`18/07/2015`)"."'>";
echo "Try it";
echo "</button>";

?>
<br>
<div id="txtHint"><b>Data will be shown here...</b></div>

</body>
</html>

对于getdata.php:

代码语言:javascript
运行
复制
<!DOCTYPE html>
<html>
<head>
<style>
table {
width: 100%;
border-collapse: collapse;
}

table, td, th {
border: 1px solid black;
padding: 5px;
}

th {text-align: left;}
</style>
</head>
<body>

<?php
$q = $_GET['q'];
echo $q;
$date_ = $_GET['t'];
echo $date_;
$con = mysql_connect('localhost','root','123');
if (!$con) {
die('Could not connect: ' . mysql_error());
}

mysql_select_db('mydb')or die('Could not select database');

$sql="SELECT * FROM t_trx WHERE rides = '".$q."' AND date1 = '".$date_."'     LIMIT 10";
echo $sql;
$result = mysql_query($sql) or die('Query failed: ' . mysql_error());

echo "<table>
<tr>
<th>Rides</th>
<th>Number</th>
<th>Date</th>
</tr>";
while($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['Rides'] . "</td>";
echo "<td>" . $row['Number'] . "</td>";
echo "<td>" . $row['Date'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>
</body>
</html>

谢谢你们。我感谢你的帮助..。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-31 09:09:40

使用下面的代码跳过刷新页

代码语言:javascript
运行
复制
onsubmit="return fshowdata(`some rides`,`a date`)"

在fshowdata函数中,您应该返回false。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31741947

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档