2015-11-18 52 views
1

我對jQuery很新。我正在使用jQuery自動完成和遠程源代碼。現在它正在打印<div>中的第二個值。我不知道如何去切換到新的input自動完成遠程源多個輸入

我希望用戶輸入到文本字段id="project"和基於自動完成了它充滿了'value'和新的輸入id="projId"來填充'id'。任何幫助將不勝感激。謝謝!

jQuery的:

<script> 
     $(function() { 
      function log(message) { 
       $("<div>").text(message).prependTo("#projId"); 
       $("#projId").scrollTop(0); 
      } 
      $("#project").autocomplete({ 
       source: "autoComp/projects.php", 
       minLength: 2,//search after two characters 
       select: function(event, ui) { 
        log(ui.item ? ui.item.id : ""); 
       } 
      }); 
     }); 

    </script> 

我的PHP腳本:

<?php 

$mysql = new mysqli("localhost", "root", "root", "casting2", 3306); 

// If the connection didn't work out, there will be a connect_errno property on the $mysql object. End 
// the script with a fancy message. 
if ($mysql->connect_errno) { 
    echo "Failed to connect to MySQL: (" . $mysql->connect_error . ")"; 
}//connect to your database 

$term = $_GET['term'];//retrieve the search term that autocomplete sends 
$theQuery = "SELECT proj AS value, projId AS id FROM projects WHERE proj LIKE '%".$term."%'"; 

$result = $mysql->query($theQuery); 

unset($row_set); 


// Move to row number $i in the result set. 
for ($i = 0; $i < $result->num_rows; $i++) { 
    // Move to row number $i in the result set. 
    $result->data_seek($i); 

    // Get all the columns for the current row as an associative array -- we named it $aRow 
    $aRow = $result->fetch_assoc(); 

    $aRow['value'] = stripslashes($aRow['value']); 
    $aRow['id'] = stripslashes($aRow['id']); 
    $row_set[] = $aRow; //build an array 
} 
    echo json_encode($row_set);//format the array into json data 

$result->free(); 

?> 

HTML表單: 現在我有<div id="projId"></div>剛上市,這樣它的作品。當我將其更改爲<input type="text">時,它不起作用,即使我嘗試更改自動完成腳本。

<form action="ADD/processADDprojCSNEW.php" method="post" onsubmit="return confirm('Do you really want to submit the form?');"> 

     <label for="project">Project Name:</label> 
     <input type="text" id="project" name="project" /> 

     <label for="projId">ID:</label> 
     <div id="projId"></div> 
     <br /> 
     <label for="company">Assign a Casting Company: </label> 
     <input id="company" name="company" required> 
     <br /> 
     <label for="compType">Casting Type</label> 
     <select id="compType"> 
      <option value="Principals">Principals</option> 
      <option value="Background">Background</option> 
     </select> 
     <br/> 
     <label for="lastEdit">Last Edit:</label> 
     <input type="hidden" id="lastEdit" name="lastEdit" 
      value="<?php print date("Y-m-d")?>" /> 

      <br /><br /> 

     <input type="submit" value ="Submit" /> 
    </form> 

謝謝!

+0

你可以發佈'form'或者'html'嗎? – camelCase

+0

我剛剛編輯帖子以包含表單。 –

回答

1

我想我明白了這個問題:您希望自動填充數據填充的value而不是div。像這樣的東西應該工作...讓我知道。

調整到輸入這樣的:

<input type="text" name="projId" id="projId"> 

,然後調整功能是這樣的:

function log(message) { 
    $("#projId").val(message); 
    $("#projId").scrollTop(0); 
} 

如果一切正常,你可以將二者結合起來像$("#projId").value(message).scrollTop(0);

更新:

我覺得我還應該提一個關於你的01的警告文件和對數據庫的查詢。我建議使用prepared statements來避免SQL注入等問題。它看起來像這樣(免責聲明......這沒有經過測試)。

/* Retrieve the search term that autocomplete sends */ 
$term = "%{$_GET['term']}%"; 

/* Create a prepared statement */ 
$stmt = $mysql->prepare("SELECT proj AS value, projId AS id FROM projects WHERE proj LIKE ?"); 

/* Bind parameters ("s" for string, and bound with your term from above) */ 
$stmt->bind_param("s", $term); 

/* Execute the query */ 
$stmt->execute(); 

/* Pass variable to hold the result */ 
$stmt->bind_result($value, $id); 

/* Loop the results and fetch into an array */ 
$row_set = array(); 
while ($stmt->fetch()) { 
    $row_set[] = array(
     'value' => $value, 
     'id' => $id 
    ); 
} 

/* Close */ 
$stmt->close(); 

/* Echo the formatted array */ 
echo json_encode($row_set); 
+0

謝謝!這工作! –

+1

@AbigailHardin歡迎您,很高興它的工作。我知道你沒有要求它,但我覺得值得一提的是SQL注入。看到我更新的答案......爲未來思考。 – camelCase