Twitter bootstrap typeahead возвращает несколько значений и заполняет editbox

Я новичок в bootstrap и мне нужна помощь, пожалуйста, я хочу создать раскрывающийся список typeahead, который возвращает 3 значения из моей базы данных mysql, когда пользователь ищет контакт имя в TEXTBOX «ContactName» и заполнить 3 окно редактирования с информацией -КОНТАКТЫ имя -Телефон Номер -Е адрес большое спасибо на заранее за все ваши усилияTwitter bootstrap typeahead возвращает несколько значений и заполняет editbox

это код, который я попробуйте вернуть одно значение, которое мне нужно изменить, чтобы вернуть все эти значения дерева. Теперь, когда я пытаюсь найти имя контакта, оно вернется с правильно, не вопрос, чтобы спросить, но я не знаю, как изменить код, чтобы принести 3 значения, как я упомянул выше

enter code here 

**php page: Customer.php** 
------------------------------------------- 
<?php 
$host = "localhost"; 
$uname = "root"; 
$pass = ""; 
$database = "db34218"; 

$connection=mysql_connect($host,$uname,$pass) or die("connection in not ready <br>"); 
$result=mysql_select_db($database) or die("database cannot be selected <br>"); 

if (isset($_REQUEST['query'])) { 

$query = $_REQUEST['query']; 

$sql = mysql_query ("SELECT ContactName, Telephone, Email FROM customer WHERE ContactName LIKE '%{$query}%'"); 
$array = array(); 

while ($row = mysql_fetch_assoc($sql)) { 
    $array[] = $row['ContactName']; 
} 

echo json_encode ($array); //Return the JSON Array 
} 
?> 




**html and java page and some php: Customersearch.php** 
------------------------------------------------ 
<body> 
. 
. 
. 
     <div class="row-fluid"> 
      <div class="span4"> 
      <label>ContactName&nbsp;</label> 
      <input type="text" name="ContactName" value="<?php echo  $row_Recordset_QuoteCustomer['ContactName']?>" data-provide="typeahead" class="typeahead input-xlarge" autocomplete="off"> 
      </div> 
      <div class="span2"> 
      <label>Telephone&nbsp;</label> 
      <input type="text" name="Telephone" value="<?php echo  htmlentities($row_Recordset_QuoteCustomer['Telephone'], ENT_COMPAT, 'utf-8'); ?>" class="span12"> 
      </div> 
      <div class="span2"> 
      <label>Email &nbsp;</label> 
      <input type="text" name="Email " value="<?php echo  htmlentities(row_Recordset_QuoteCustomer['Email '], ENT_COMPAT, 'utf-8'); ?>" class="span12"> 
      </div> 
......... 
. 
. 
. 
. 
. 
. 

<script src="../js/jquery.js"></script> 
<script src="../js/bootstrap-transition.js"></script> 
<script src="../js/bootstrap-alert.js"></script> 
<script src="../js/bootstrap-modal.js"></script> 
<script src="../js/bootstrap-dropdown.js"></script> 
<script src="../js/bootstrap-scrollspy.js"></script> 
<script src="../js/bootstrap-tab.js"></script> 
<script src="../js/bootstrap-tooltip.js"></script> 
<script src="../js/bootstrap-popover.js"></script> 
<script src="../js/bootstrap-button.js"></script> 
<script src="../js/bootstrap-typeahead.js"></script> 
<script src="../js/SpecWorkPages/getItemsList.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() 
{ 
$('input.typeahead').typeahead({ 
    source: function (query, process) 
    { 
     $.ajax(
     { 
      url: 'Customer.php', 
      type: 'POST', 
      dataType: 'JSON', 
      data: 'query=' + query, 
      success: function(data) 
      { 
       console.log(data); 
       process(data); 
      } 
     }); 
    } 
}); 
}) 
</script> 
</body> 
</html> 
<?php 
mysql_free_result($RecordsetQuote); 
mysql_free_result($Recordset_QuoteStatus); 
mysql_free_result($Recordset_QuoteCustomer); 
?>

источник

2013-08-28 elie jammal

Wi Какой бы ни был код, для кого-то это будет сложно. Если у вас их еще нет, я бы предложил посмотреть здесь https://gist.github.com/Yavari/1891669 для хорошего начала. Вы также можете проверить другие сообщения SO по этому вопросу с помощью быстрого поиска: http://stackoverflow.com/search?q=bootstrap+typeahead – Brian

ok Я добавляю свой код, может ли кто-нибудь помочь мне модифицировать мой код, спасибо –

Если я правильно понять вас, вы получаете результаты обратно, но не в состоянии заселить поля ввода. Хотя я не использую Twitter Bootstrap typeahead, я делаю что-то очень похожее с функцией автозаполнения jQuery. Код ниже не проверен, и, конечно же, вам нужно будет его изменить самостоятельно, но, надеюсь, это поможет.

См. Это рабочий стол jsFiddle demo для чего-то подобного.

PHP

$array = array(); 
while ($row = mysql_fetch_assoc($sql)) { 
    array_push($array,array('ContactName'=>$row['ContactName'],'Telephone'=>$row['Telephone'],'Email'=>$row['Email'])); 
} 
echo json_encode($array);

Вы можете проверить, что получает возвращаемый ручного ввода URL (например:? YourSite/Customer.php запроса = SomeContactName). Вы должны увидеть что-то похожее на это:

[{"ContactName":"Some Contact","Telephone":"5555555555","Email":"[email protected]"}, 
{"ContactName":"Some Other Contact","Telephone":"5555555555","Email":"[email protected]"}]

HTML/Javascript

<script> 
    $('input.typeahead').typeahead({ 
     source: function (query, process) { 
      $.ajax({ 
       url: 'Customer.php', 
       type: 'POST', 
       dataType: 'JSON', 
       // data: 'query=' + query, 
       data: 'query=' + $('#contactName').val(), 
       success: function(data) 
       { 
        var results = data.map(function(item) { 
         var someItem = { contactname: item.ContactName, telephone: item.Telephone, email: item.Email }; 
         return JSON.stringify(someItem.contactname); 
        }); 
        return process(results); 
       } 
      }); 
     }, 
     minLength: 1, 
     updater: function(item) { 
      // This may need some tweaks as it has not been tested 
      var obj = JSON.parse(item); 
      return item; 
     } 
    }); 
</script>

Вот несколько других сообщений, которые вы можете захотеть взглянуть на How to return the response from an AJAX call? и Bootstrap typeahead ajax result format - Example

источник

2013-08-29 18:41:51 Brian

спасибо много для вашей помощи. Я очень ценю, что я собираюсь попробовать модификатор моих страниц, спасибо большое –

Добро пожаловать! Счастливое кодирование! – Brian

Извините, что снова заблудился Мозг с моим кодом, я попытался добавить ваш код на свою страницу, чтобы он не работал в случае окна редактирования для имени контакта, когда я ввожу имя, которое он останавливает, ища его. Я не уверен, что мне нужно. ваша помощь снова, поле namename должно быть похоже на автозаполнение в jquery, когда я начну вводить имя контакта, оно вернет все имя, найденное в моей таблице mysql, мой код выше работает идеально для этого сценария, но мне нужно получить телефон и электронную почту чтобы заполнить другие 2 поля редактирования, пожалуйста, помогите. –

Twitter bootstrap typeahead возвращает несколько значений и заполняет editbox

ответ

Смежные вопросы