簡體   English   中英

想要從“通過提交選擇標簽”按鈕獲取價值

[英]Want to get value from Select Tag by Submit button

 <html>
    <head>
    <script>
    function showUser()
    {
    //var s=document.getElementById('uni');     //this also not working
    //var str=s.options[s.selectedIndex].value;
    var str=document.form.formList.value;
    if (str=="")
      {
      document.getElementById("txtHint").innerHTML="";
      return;
      } 
    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;
        }
      }
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
    }
    </script>
    </head>
    <body>
    <form  name="form">
    <select name="formList" id="uni" >
    <option value="">Select a person:</option>
    <option value="1">University 1</option>
    <option value="2">University 2</option>
    <option value="3">University 3</option>
    <option value="4">University 4</option>
    </select>
    <input  type="submit" value="Search" onsubmit="showUser()" >
    </form>
    <br>
    <div id="txtHint"><b>Person info will be listed here.</b></div>
    </body>
    </html>

 Want to get value from Select Tag by Submit button.....  

通過使用javascript,然后發送到AJAX,以將該數據轉發到userget.php文件,以從SQL DATABASE獲取數據,然后顯示到Web上。 請我被困在這里,有人告訴我我做錯了什么...? 我想通過提交按鈕存儲下拉列表中的值...

/////////////////服務器端代碼/////////////////////////////

<?php
$q = intval($_GET['q']);

$con = mysqli_connect('localhost','root','','degree');
if (!$con)
  {
  die('Could not connect: ' . mysqli_error($con));
  }

mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM uni WHERE id = '".$q."'";

$result = mysqli_query($con,$sql);

echo "<table border='1'>
<tr>
<th>Id</th>
<th>Univeristy</th>
<th>Degree</th>
<th>Location</th>
<th>Rank</th>
<th>Fees</th>
</tr>";

while($row = mysqli_fetch_array($result))
  {
  echo "<tr>";               
  echo "<td>" . $row['Id'] . "</td>";
  echo "<td>" . $row['Univeristy'] . "</td>";
  echo "<td>" . $row['Degree'] . "</td>";
  echo "<td>" . $row['Location'] . "</td>";
  echo "<td>" . $row['Rank'] . "</td>";
  echo "<td>" . $row['Fees'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysqli_close($con);
?>

如果使用JQuery,則可以執行以下操作:

$(document).ready(function(){
    $('#searchButton').click(function(){
        if ($('#uni').val()) {
            $.post(
                'getuser.php',
                {
                    q: $('#uni').val()        
                },
                function(personInfo){
                    if (personInfo) {
                        $('#txtHint').text(personInfo)
                    }
                }
            );
        } else {
            alert('Please select an option first.');
        }     
    });
});

只需將表單中的輸入類型從“提交”更改為“按鈕”,然后將ID添加為“ searchButton”即可。

在服務器端腳本中,使用POST而不是GET:

$q = intval($_POST['q']);

首先,更可靠的獲取xmlhttp方法

function getXmlHttp(){ 
  var xmlhttp;
  try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
      xmlhttp = false;
    }
  }
  if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
  }
  return xmlhttp;
}

其次是做您想要做的正確表格是:

<form  name="form" onsubmit="showUser(); return false;">
  <select name="formList" id="uni" >
    <option value="">Select a person:</option>
    <option value="1">University 1</option>
    <option value="2">University 2</option>
    <option value="3">University 3</option>
    <option value="4">University 4</option>
  </select>
  <input  type="submit" value="Search" />
</form>

和showUser函數一樣:

function showUser()
{
  //var s=document.getElementById('uni');     //this also not working
  //var str=s.options[s.selectedIndex].value;
  var str=document.form.formList.value;

  if (str=="")
  {
    document.getElementById("txtHint").innerHTML = "";
    return;
  }

  var xmlhttp = getXmlHttp();

  xmlhttp.onreadystatechange = function()
  {
    if (xmlhttp.readyState==4)
    {
      if(xmlhttp.status == 200) {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
      } else {
        // add error handler here
      }
    }
  };
  xmlhttp.open("GET","/getuser.php?q="+str,true);
  xmlhttp.send();
}

完全不必理會submit 這將解決問題:)

<input type="button" onclick="showUser();" value="Search" />

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM