使用从jquery传递的变量到php动态更新字段

时间:2014-02-25 16:32:16

标签: javascript php jquery mysql ajax

我在下拉列表中有一堆锁定号码(从MYSQL / PHP填充)。我想在同一页面下面的两个输入字段中从列表中选择一个储物柜编号时显示储物柜的组合和位置。

我用jquery告诉我动态选择列表中的哪个项目。然后我使用$ .ajax()函数将该项发送到我的服务器。

我的问题:我可以使用$ .ajax()将我的变量发送到我所在的同一页面吗?我试过这个,但是我收到了一个错误。我不知道如何做到这一点。我对AJAX的了解非常少。

我的代码如下:

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Locker Backend</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" type="text/css" href="form.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript">
function show()
{
   $('#addlocker').toggle();
}
    function lockerSelected(sel)
       {
    var selected = (sel.options[sel.selectedIndex].text);
        $.ajax({
        type:"POST",
        url: "studentdata.php",
        data: selected,
        success: function(){
            alert(selected);
        }
       });
       }
    </script>
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    </head>

    <body>
    <?php
        $url = $_SERVER['REQUEST_URI'];
        $studID = substr($url, strpos($url, "=") + 1);

    $db_handle = mysql_connect("localhost", "root", "pickles") or die("Error connecting to database: ".mysql_error());


        mysql_select_db("lockers",$db_handle) or die(mysql_error());

    $result = mysql_query("SELECT * FROM students WHERE studID = $studID"); 
        ?>
    <div class="container">
      <header> <a href="#"><img src="images/headmast.png" alt="Insert Logo Here" width="686" height="180" id="Insert_logo" /></a> </header>
      <div id="data1">
      <form id ="studData" name="studData" action="update.php" medthod="post">
        <fieldset>
          <legend>Student Details</legend>
          <?php
      while($row = mysql_fetch_array($result)) 
      { 
      echo '<ol>';
       echo '<li>';
      echo '<label for=studid>Student ID</label>';
      echo '<input id=studid name=studid type=text value='.$row['studID'].'>';
      echo '</il>';
      echo '<li>';
      echo '<label for=fname>First Name</label>';
      echo '<input id=fname name=fname type=text value='.$row['firstName'].'>';
      echo '</il>';
      echo '<li>';
      echo '<label for=fname>Last Name</label>';
      echo '<input id=lname name=lname type=text value='.$row['lastName'].'>';
      echo '</il>';
      echo '<li>';
      echo '<label for=email>Email</label>';
      echo '<input id=email name=email type=text value='.$row['email'].'>';
      echo '</il>';
      echo '<li>';
      echo '<label for=progam>Program</label>';
      echo '<input id=progam name=progam type=text value='.$row['program'].'>';
      echo '</il>';
      echo '</ol>';
      $program = $row['program'];  //get name of program 
      } 
      ?>
          <input type="submit" value="Update" class="fButton"/>
        </fieldset>
      </form>

      <form id="locker" name="locker" action="" method="post" >
        <fieldset>
          <input type="button" onclick="show()" value="Add Locker"/>
          <div id="addlocker" style="display:none;"> 
          <!--
          query lockers where $program = program parsed in & student id is equal to 0 (this makes it available)
          get select list to 10
          populate select list    -->  <br/>
          <legend>Lockers Available: </legend>
          <select size="10" name="lockerSelect" multiple="yes" style="width:200px;" onChange="lockerSelected(this);">
          <?php
          $result1=mysql_query("SELECT * FROM lockers WHERE progName = '$program' && studID = 0") or die($result1."<br/><br/>".mysql_error());
          while($row1 = mysql_fetch_array($result1)) 
      {
         echo '<option value=\"'.$row1['lockerScan'].'">'.$row1['lockerNo'].'</option>';
      }
      echo '</select>';
        echo '<br>';

        $lockerNo = $_POST['selected'];  \\doesn't work - displays error
        echo $lockerNo; \\errors out
          ?>
          </div><!--end of add locker section-->
        </fieldset>
      </form>
      </div><!--end of data1 -->
    <a href="backendhome.php" class="actionButton" style="float:left;clear:both">Search</a>  


    </div><!-- end of container-->
    </body>
    </html>

2 个答案:

答案 0 :(得分:0)

首先,您可以使用:

function show()
{
   $('#addlocker').toggle();
}

然后,您应该了解有关Ajax和PHP的更多信息。你的电话应该是:

var selected = (sel.options[sel.selectedIndex].text);

$.ajax({
   type:"POST",
   url: "studentdata.php",
   data: {selected: selected},
   success: function(data){
      alert(data);
   }
});

在你的PHP文件中:

<?php 
$select = $_POST['selected'];

//....
// Do what you have to do then return your result    

echo '<div>Send to your page !</div>';

答案 1 :(得分:0)

首先安排你的文件。 js位于js文件夹中 php文件夹中的php

最好的方法是分配一个单独的php页面然后在js上使用更改事件

$(document).on("change", "#selectfieldid", function(){
  var selected = $('#selectfieldid').val();
   $.ajax({
    type:"POST",
    url: "studentdata.php",
    data: selected,
    success: function(data){
        $('#addlocker').val(data); //echoed result placed here that has id addlocker

    }
   });
});

将这些发送到php页面,回显那个php的结果。