PHP - Jquery Tokenizing Autocomplete Troubleshooting
I'm playing with this tokenizing autocomplete script but am having a strange issue with it.
It all seems to work ok and it's pulling the values over from the php file that's doing the db query ok and if you put in a value that doesn't match it will tell you so, however if you do type in a value that matches it simply disappears. This script is exactly like the demo script except for the paths to the js, css, and php files, and I did remove the 1st example but was having this issue before removing it. No changes made to the js file, php file is identical to the demo just with my own db info and table info put in, and no changes to the css file compared to the demo. I've tried this both with jquery 1.3.0 and 1.4.2 and have the same issue with both. Here is the link to my test page: http://www.erecoverydev.com/autocomplete2/autocomplete.html Here is my js file: http://www.erecoverydev.com/autocomplete2/jquery.tokeninput.js Here is my php code: Code: [Select] <? mysql_pconnect("localhost", "myuser", "mypass") or die("Could not connect"); mysql_select_db("mydb") or die("Could not select database"); $query = sprintf("SELECT cb_activities from jos_comprofiler WHERE cb_activities LIKE '%%%s%%' ORDER BY cb_activities DESC LIMIT 10", mysql_real_escape_string($_GET["q"])); $arr = array(); $rs = mysql_query($query); while($obj = mysql_fetch_object($rs)) { $arr[] = $obj; } echo json_encode($arr); ?> A couple of values that are in my table are web development and kicking cats if you want to test it. Here is the link to the demo: http://loopj.com/tokeninput/demo.html It just doesn't make any sense to me why the demo works and mine doesn't when they are basically identical. Similar TutorialsHey guys im having 2 minor problems with my script if someone can give me some advise please?
(all 2 problems are commented on the script itself)
1. highlighting string characters when typed.
2. also im trying to add "Hide Suggestions" at the bottom of my menu so people can turn on/off autocomplete
$(document).ready(function() { function search_autocomplete(selector, tags, default_value) { $('#' + selector).focus(function() { if($('#' + selector).val() == default_value) { $('#' + selector).val(''); } }); $('#' + selector).blur(function() { if($('#' + selector).val() == '') { $('#' + selector).val(default_value); } }); $('#' + selector).autocomplete( { source: tags, timeout: 0, select: function (a, b) { $(this).val(b.item.value); //submit }, create: function () { $(this).data('ui-autocomplete')._renderItem = function (ul, item) { // not highlighting when string characters match var re = new RegExp('^' + this.term); var t = item.label.replace(re, "<span id='dropdown-item-highlight'>" + "$&" + "</span>"); return $('<li></li>') .append('<a>' + t + ' in ' + item.type + '</a>') .addClass( 'dropdown-item' ) .appendTo(ul); }; } }); $(this).data('ui-autocomplete')._renderMenu = function (ul, item) { // unable to show "Hide Suggestions at the bottom of the autocomplete menu return $('<ul></ul>') .append('<a>Hide Suggestions</a>') .addClass( 'dropdown-menu' ); }; } var availableTags = [{"label" : "XBOX 360", "type":"Electronics"}, {"label":"XBOX One", "type":"Electronics"}, {"label":"Nike", "type":"Clothing & Footwear"}]; search_autocomplete('query', availableTags, 'Search...'); });thanks First, Happy X-Mas to all! I want to do a form for entering dog-show results. On first site of form the user is able to enter how many dogs for each class (there are youth and open class for example) he want to insert. So on second site there will be formfields for every dog in every class, created with php. User should be able to take dogname from jquery autocomplete - this works for multiple fields. But i need the according id to the dogname - and actual only one id is given - the first one is changing by choosing from autocomplete in next fields... Data came from a json array like 0: {dogidindatabase: "9892", value: "Excalibur Khali des Gardiens de la Cour ",…} dogidindatabase: "9892" label: "<img src='../main/img/female.png' height='20'>Excalibur Khali des Gardiens de la Cour " value: "Excalibur Khali des Gardiens de la Cour " 1: {dogidindatabase: "15942", value: "Excalibur from Bandit's World Kalli",…} dogidindatabase: "15942" label: "<img src='../main/img/male.png' height='20'>Excalibur from Bandit's World Kalli" value: "Excalibur from Bandit's World Kalli"all i need is inside ... the script in form is <script type='text/javascript'> //<![CDATA[ $(function() { $(".dog").autocomplete({ source: "xxx.php", minLength: 3, select: function(event, ui) { $('#dogidindatabase').val(ui.item.dogidindatabase); } }); $["ui"]["autocomplete"].prototype["_renderItem"] = function( ul, item) { return $( "<li></li>" ) .data( "item.autocomplete", item ) .append( $( "<a></a>" ).html( item.label ) ) .appendTo( ul ); }; }); //]]> </script>and the form looked like <input type='text' name='dog' class='dog' value='".strip_tags(${'dogname' .($countbabymale+1)})."' size='35' data-required='true' /><br> <input class='readonly' readonly='readonly' type='text' id='dogidindatabase' name='dogidindatabase' size='5' />I changed in script and form id='dogidindatabase' to class, but it doesn´t work. Testsite is under http://www.wolfdog-d...how.php?lang=de (only german at first) - Insert a number (higher than 1) under baby 3-6 (first box, the others are not working for testing); submit to get to page 2; you see all post-variables (for testing). Try to insert a dogname in first input-field (choose "exc") and insert first one - the id is under dogname. In second dogname inputfield you can choose second dog - the id for the first one changes to id of seond one .... How can i get both for every dog? I have a page that processes a variable passed in the url to go get information out of a text file in JSON format. For some reason though, passing one variable loads a page, passing a certain variable (who's data in the file is virtually identical to the first) will cause the browser to just load the page indefinitely. Maybe even more strange is that on my local machine, the variable that won't load is switched, and the other loads fine. How can I debug what's happening when the page never loads so that I never get an error? I am having difficulties with my include_path directives in the php.ini file. Please click the link below to see a screencast of the problem: http://screenr.com/vhY I am very confused as sometimes the include_path does work and sometimes it doesn't work. Also am I allowed to have multiple include_path directives or do I need to include every path in a single include_path directive. I am creating an add on to a 3rd party CMS called Concrete5. Normally, when I have client issues, I can trace them to the server and fix them, however, this not doing so well on these issues. The following errors are being displayed in Chrome console:
Checking the server’s folder directory, it is true there is no concrete/fonts directory but there is a concrete/css/fonts directory with a couple of the missing files (but not glyphiconshalflings-regular.woff2).
Back to the errors, clicking the line number (i.e. 927, 3115, and 1), chrome blames apparently innocent line numbers.
What steps would you recommend taking to identify the cause and fix these errors? hey guys im trying to get an autocomplete script working at the moment...although im pretty new to jquery...ive added jquery.js and jquery-ui.js (I think I need both?)
here is my code if anyone can give me some pointers please...thank you
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <script type="text/javascript" src="media/scripts/library/jquery.js"></script> <script src="media/scripts/library/jquery-ui.js"></script> <script> $(document).ready(function() { function autocomplete(selecor, tags) { $( '#' . + selector).autocomplete( { source: tags }); } var availableTags = [ "ActionScript", "AppleScript", "Asp"]; autocomplete('query', availableTags); }); </script> <title></title> </head> <body> Search: <input type="text" name="q" id="query" /> </body> </html> I read this article. About two thirds down it mentions that you can turn off autocomplete on the entire form if you put it in the form tag. The post is from 2011 though so I was wondering if it is still valid? Does anyone know if this is still correct? So, can I use something like; <form action="example.php" autocomplete="off"> First name:<input type="text" name="fname"> Last name: <input type="text" name="lname"> E-mail: <input type="email" name="email"> <input type="submit"> </form>Or do I need something like; <form action="example.php"> First name:<input type="text" name="fname" autocomplete="off"> Last name: <input type="text" name="lname" autocomplete="off"> E-mail: <input type="email" name="email" autocomplete="off"> <input type="submit"> </form>To be sure... I have a working autocomplete which connects to my database using ajax. I am trying to include a function where the user can scroll through the results list using the up/down arrow keys. All of the suggestions I found in google basically broke my autocomplete and yes I've installed the latest Jquery.
Also, for some reason the user has to click the upper half of the search result in order for the data to display otherwise it won't register for some reason any ideas about that?
Any help would be greatly appreciated. Thanks
<script type="text/javascript"> $(function(){ $(".search").keyup(function() { var searchid = $(this).val(); var dataString = 'search='+ searchid; if(searchid!='') { $.ajax({ type: "POST", url: "search.php", data: dataString, cache: false, success: function(html) { $("#result").html(html).show(); } }); }return false; }); jQuery("#result").live("click",function(e){ var $clicked = $(e.target); var $name = $clicked.find('.name').html(); var decoded = $("<div/>").html($name).text(); $('#searchid').val(decoded); var yourLinkHref= $(this).attr('href'); window.location = "mainpage.php?TopicName=" + $name; }); jQuery(document).live("click", function(e) { var $clicked = $(e.target); if (! $clicked.hasClass("search")){ jQuery("#result").fadeOut(); } }); $('#searchid').click(function(){ jQuery("#result").fadeIn(); }); }); </script> hi, here is my AutoComplete: http://www.mypubspace.com/phpsite/autoComplete/ At the moment it searched through rsPubName (Pub Names) and outputs Pub Name and rsTown(Town) aswell I would like for the user to type a town and it show all pubs in that town?! here is the PHP code <?php // PHP5 Implementation - uses MySQLi. // mysqli('localhost', 'yourUsername', 'yourPassword', 'yourDatabase'); $db = new mysqli('***', '***' ,'***', '***'); if(!$db) { // Show error if we cannot connect. echo 'ERROR: Could not connect to the database.'; } else { // Is there a posted query string? if(isset($_POST['queryString'])) { $queryString = $db->real_escape_string($_POST['queryString']); // Is the string length greater than 0? if(strlen($queryString) >0) { // Run the query: We use LIKE '$queryString%' // The percentage sign is a wild-card, in my example of countries it works like this... // $queryString = 'Uni'; // Returned data = 'United States, United Kindom'; // YOU NEED TO ALTER THE QUERY TO MATCH YOUR DATABASE. // eg: SELECT yourColumnName FROM yourTable WHERE yourColumnName LIKE '$queryString%' LIMIT 10 $query = $db->query("SELECT * FROM pubs WHERE rsPubName LIKE '$queryString%' LIMIT 10"); if($query) { // While there are results loop through them - fetching an Object (i like PHP5 btw!). while ($result = $query ->fetch_object()) { // Format the results, im using <li> for the list, you can change it. // The onClick function fills the textbox with the result. // YOU MUST CHANGE: $result->value to $result->your_colum echo '<li onClick="fill(\''.$result->rsPubName.', '.$result->rsTown.'\');">'.$result->rsPubName.', '.$result->rsTown.'</li>'; } } else { echo 'ERROR: There was a problem with the query.'; } } else { // Dont do anything. } // There is a queryString. } else { echo 'There should be no direct access to this script!'; } } ?> and the Javascript Code: [Select] <script type="text/javascript"> function lookup(inputString) { if(inputString.length == 0) { // Hide the suggestion box. $('#suggestions').hide(); } else { $.post("rpc.php", {queryString: ""+inputString+""}, function(data){ if(data.length >0) { $('#suggestions').show(); $('#autoSuggestionsList').html(data); } }); } } // lookup function fill(thisValue) { $('#inputString').val(thisValue); setTimeout("$('#suggestions').hide();", 200); } </script> Hello, I am trying to implement some code I found and downloaded he http://www.roscripts.com/Ajax_autosuggest_autocomplete_from_database-154.html When I try and run this I get no search results back when searching? I have entered data in the database and all connections seem good. Several people in the comments say they have problems, but no solution. Any one that can find the fault here? - THANKS <?php require_once('db.php'); include('classes/stem.php'); include('classes/cleaner.php'); if( !empty ( $_POST['search'] ) ): $string = $_POST['search']; $main_url = 'http://www.roscripts.com/'; $stemmer = new Stemmer; $stemmed_string = $stemmer->stem ( $string ); $clean_string = new jSearchString(); $stemmed_string = $clean_string->parseString ( $stemmed_string ); $new_string = ''; foreach ( array_unique ( split ( " ",$stemmed_string ) ) as $array => $value ) { if(strlen($value) >= 3) { $new_string .= ''.$value.' '; } } $new_string = substr ( $new_string,0, ( strLen ( $new_string ) -1 ) ); if ( strlen ( $new_string ) > 3 ): $split_stemmed = split ( " ",$new_string ); mysql_select_db($database); $sql = "SELECT DISTINCT COUNT(*) as occurences, title, subtitle FROM articles WHERE ("; while ( list ( $key,$val ) = each ( $split_stemmed ) ) { if( $val!='' && strlen ( $val ) > 0 ) { $sql .= "((title LIKE '%".$val."%' OR subtitle LIKE '%".$val."%' OR content LIKE '%".$val."%')) OR"; } } $sql=substr ( $sql,0, ( strLen ( $sql )-3 ) );//this will eat the last OR $sql .= ") GROUP BY title ORDER BY occurences DESC LIMIT 10"; $query = mysql_query($sql) or die ( mysql_error () ); $row_sql = mysql_fetch_assoc ( $query ); $total = mysql_num_rows ( $query ); if($total>0): echo ' <div class="entry">'."\n"; echo ' <ul>'."\n"; while ( $row = mysql_fetch_assoc ( $query ) ) { echo ' <li>'."\n"; echo ' <a href="'.$main_url.'articles/show/'.$row['id'].'">'.$row['title'].''."\n"; echo ' <em>'.$row['subtitle'].'</em>'."\n"; echo ' <span>Added on 2007-06-03 by roScripts</span></a>'."\n"; echo ' </li>'."\n"; } echo ' </ul>'."\n"; echo ' </div>'."\n"; endif; endif; endif; ?> The code can be found in attached zip file. Hi All (Again) I am looking to pick up variables in jquery from a string created: function search_by() { var search_term = $('#search_for', $(this).attr('value')); alert(search_term); } I cant seem to get the value i am trying to into a "var". This is the code on the page i am using a onClick="search_by();" i.e: <a class="show_cats" search_cat="PDAs & Accessories" search_for="fire" onclick="search_by();" href="#"> I am trying to get the value inside the "search_for" field. Any ideas???? Hey, I have a foreach loop displaying some data from my table, what i need to do is run a Jquery each function on the repeated element so it fadesIn each element one at a time. I am guessing i need to set somesort of interval for this to work. I have been messing with it for a good hour or so now and i cant seem to get it working. Has anyone done this before or seen it done else were? Hi I am in the process of teaching myself web development, coming from a vb and mssql background. I am building a small page that will display my film library, I just want something quick and simple that gets things working. I have three img tags on my page that display the film posters. The current film and the one previous and next. What I would like is a left and a right arrow that just scroll through the library. I am thinking I need to read the sub folder of D:\movies and story the full path name into an array, and then when the user presses a arrow it moves forward or back. Everything is local and I am unsure about how to handle the event of the left/arrow being pressed. Does PHP handle that kind of event or would Jquery be more suitable or something else completely?? thanks for any pointers. Alright guys, I have a bit of a problem here. I am deleting records using isset($_POST) on the current page but when it submits the records i deleted are still visible. I was thinking of echoing some jquery/ajax to re-load the div that displays the records. Has anyone ever done this before? I dont want the entire page to re-load just that specific area. I keep saying I'm going to have to learn javascript and then the library jQuery but find myself learning Swift now instead.
Short one today. I want these two functions to occur back to back. Second function only begins after the first function is complete.
$(function() { $('.tlt').textillate(); }) $(function() { $('.tlt1').textillate(); })If you can please help me with this not only in just code to make that happen but also an explanation of what you did I sure would appreciate it. I've read all morning on promises etc. but have yet to be successful in implementing this. As you can tell I'm using the plug-in textillate to fade text out one letter at a time. Works great! But I have multiple paragraphs I'm wanting to apply this too so I can't make the div class .tlt since I then lose all paragraphs since it's strips it into spans. That would be ideal of course but I think I forced into making different classes for each paragraph. This will become problematic in the future though since the content is generated dynamically and I will have no idea how many paragraphs that dynamic content will contain. So if there was a way to keep my <p> and </p> that would be even better. Thanks! Im wondering if i should use jQuery or Php. and how about i would go about doing this. Code: [Select] <?php print "<table border=\"0\" cellpadding=\"0\" width=\"100%\" height=\"100\"cellspacing=\"0\" style=\"border-collapse:collapse\"bordercolor=\"grey\" bgcolor=\"white\" valign=\"top\"> <td align=\"left\" width=\"100%\" onclick=\"I3.location.href='getuserdetail.php?prop=$ownerid'\"><b>Property Name</b></td><td><b>Tenant</b></td><td><b>Property Status</b></td><td>Rent Amount</td>"; $connect = mysql_connect("localhost","root",""); mysql_select_db("magic"); $query = "SELECT * FROM props WHERE ownerid = '$ownerid' ORDER BY name ASC "; $result = mysql_query($query); while($row = mysql_fetch_assoc($result)) { $propertyid = $row['propid']; $propertyname = $row['name']; $propertydesc = $row['description']; $propertycity = $row['city']; $propertystate = $row['state']; $propertyzip = $row['zip']; $active = $row['active']; $lease = $row['lease']; $leaseamt = $row['leaseamt']; if($active == "1"){ $propertystatus = "Active"; } else { $propertystatys = "Unknown"; } print"<tr onMouseOver=\"this.bgColor = '#CEE3F6'\" onMouseOut =\"this.bgColor = '#FFFFFF'\"> <td align=\"left\" width=\"25%\" onclick=\"window.open('viewpropdetail.php?prop=$propertyid','mywindow','width=1200,height=600,scrollbars=1')\">$propertyname</td><td>$ownerfirstname $ownerlastname</td><td>$propertystatus</td><td>$$leaseamt</td> "; } print"</td></table>"; ?> Basically i have a link under that is add property. it pops up a box. with a form you fill it out, and it inserts the record into database. What I'm trying to do. is get it to "Refresh" the property list ( ex. code above). so it shows the new property in the table. i have never used jQuery. but was wondering if i could do that with php. Is there a way to say if records are changed.. update? I have a while loop fucntion displaying a list of records, each while records contains a hidden div with additional infomation and a button that will call JQuery slideToggle() function. each button on each record toggles alll the hidden divs. Does anyone have any ideas on how to sort this issue? This topic has been moved to Ajax Help. http://www.phpfreaks.com/forums/index.php?topic=316223.0 I am using jQuery to post the contents of a html form to a php file which process them then returns a result. jQuery then catches this result and either logs you in or displays an error. This is working fine. It logs me in if i specify the right details and doesnt if i specify wrong details. However when i am redirectd to the home page I have a line which says welcome {username}. However username displays an undefined. Here is the form(cut down) <form name="login_form" id="login_form" method="post"> <input id="user_name" class="field" type="text" name="user_name_field" /> </form> next is the jquery which posts the form data(cut down): jQuery("#login_form").submit(function() { jQuery.post("./modules/login_process.php",{ user_name:jQuery("#user_name").val() } ,function(data) { if (data == 1) { document.location="./index.php"; } else { } }); }); then is the login_process.php if (isset($_POST['user_name'])) { $user_name = asf_escape(trim($_POST['user_name'])); $login_query = mysql_query("SELECT * FROM ".TBL_PREFIX."members WHERE user_username = '$user_name' ") or die (mysql_error()); $result = mysql_num_rows($login_query); if ($result != 0) { $_SESSION['logged_in'] = 1; $_SESSION['user_username'] = $user_name; echo $result; } else { if(!empty($user_name)) { $error .= "No Records Found for Username: $user_name "; } echo $error; } As I said it works fine logging in, the username is checked against the database but when i return the session which is equal to the posted username i get "undefined". Anyone see where i am going wrong? |