Событие клика просто обновляет страницу? - PullRequest
0 голосов
/ 11 июля 2011

Я немного растерялся, пытаясь разобраться с этой ошибкой, и, пожалуйста, держите меня в покое.Когда я нажимаю кнопку «Отправить», кажется, что страница просто обновляется, и не отображаются сообщения, которые предположительно читают «Завершено» или «Нет».Я добавил несколько функций Ajax для динамического заполнения выпадающего списка для получения информации из базы данных MySQL.

Вопрос: Почему моя страница не отправляется, она просто «обновляется»? (после добавления функции Ajax и заполнения выпадающего списка из файла php)

<SCRIPT type="text/javascript"> 
function populatematerial(str)
{   
    if (window.XMLHttpRequest) 
    {
    // IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }

    else
    {
    // IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange=function()
    {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
      }
    }

    xmlhttp.open("GET","getmaterial.php?q="+str,true);
    xmlhttp.send();
}

<form name='form1' method="POST" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<table border="0" width="100%" id="table1">
    <tr>
        <td width="144">DB Username</td>
        <td><input type="text" name="dbusername" size="32"></td>
    </tr>
    <tr>
        <td width="144">DB Password</td>
        <td><input type="password" name="dbpassword" size="32"></td>
    </tr>
    <tr>
        <td width="144">Tank Type</td>
        <td><select name="tanktype" id="tools" onChange="populatematerial(this.value)">
        <option></option>
        <option value="Metal">Metal</option>
        <option value="Rinse">Rinse</option>
        </select>
        </td>
    </tr>
    <tr id="material_show" style="display:none;">
        <td width='144'>Material</td>
        <td>
        <select size='1' name='material' id="txtHint">
        </select>
        </td> 
    </tr>
</table>
<p><input type="submit" value="Submit" name="result" ></p>

 <?php
if (isset($_POST['result']))
{
session_start();

// check user id and password 

 if (!authorized($dbuser1,'#####')) {
  echo "<h2>You are not authorized.  Sorry.</h2>";
  // exit to different page
 }

// open database connection

// upload some data via $submitquery

mysql_query($submitquery) or die('UNABLE TO SUBMIT DATA');
echo "<b>Submit Successful</b><p>";

// close database connection

?>

Файл PHP, который заполняет раскрывающийся список материалов:

<?php
$q=$_GET["q"];

// open database connection

$query = "select * from r2rtool.platingmaterialtype where type = '".$q."'";
$result = mysql_query($query);

$option = "";

while($row = mysql_fetch_array($result))
{
    $option.="<option value=\"{$row['Material']}\">{$row['Material']}</option>";
}
echo "<option value='0'></option>";
echo $option;

// close database connection
?>

Ответы [ 2 ]

1 голос
/ 11 июля 2011

В дополнение к ответу gilly3 вы также можете вернуть false в событии onclick кнопки.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
</head>
<body>
    <form>
        <input type="submit" onclick="return false;" value="Click me" />
    </form>
</body>
</html>
1 голос
/ 11 июля 2011

Нажав кнопку отправки в форме, вы отправите страницу.Если вы не хотите, чтобы это происходило, вы должны явно предотвратить это, обработав событие form.onsubmit и отменив событие:

document.forms.form1.onsubmit = function(e)
{
    e = e || window.event;
    if (e.preventDefault) e.preventDefault();
    e.returnValue = false;

    // Do something else instead here
}

Вы также можете отменить событие click кнопки отправки:

document.forms.form1.result.onclick = function(e)
{
    e = e || window.event;
    if (e.preventDefault) e.preventDefault();
    e.returnValue = false;

    // Do something else instead here
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...