79445

jquery autocomplete with dialog updating value

Question:

I have a form that opens up in a dialog. One of the fields has autocomplete. All fields are built and server values are stored in them to pre-fill the form.

var mydiv = jQuery("#editform"); var $myform = jQuery("<form id='EditForm' method='post' action='index.php?option=com_component&task=edit'></form>"); ... var $mylabel10 = jQuery("<label for='EditSelect'>A label</label>"); var $myinput9 = jQuery("<input id='EditSelect' name='EditSelect' type='text' />"); var $mylabel9 = jQuery("<label for='EditSelect2'>Another label</label>"); var $myinput8 = jQuery("<input id='EditSelect2' name='add_path' value='" +path + "' />"); //path is a value passed in from the server $myform.append(... $mylabel10, $myinput9, $mylabel9, $myinput8); mydiv.append($myform); //autocomplete code - order is important to have autocomplete go outside dialog var available = [ { label : 'foo', value : 'bar' }, { label : 'xyz', value : 'abc' }, ... ]; jQuery( "#EditSelect", mydiv ).autocomplete({ source: available, focus : function(){ return false; } }) .on( 'autocompleteselect', function( e, ui ){ var t = jQuery(this), details = jQuery('#EditSelect2'), label = ( e.type == 'autocompleteresponse' ? ui.content[0].label : ui.item.label ), value = ( e.type == 'autocompleteresponse' ? ui.content[0].value : ui.item.value ); t.val( label ); details.val( value ); //doesn't update the form here? return false; }); // get reference to autocomplete element var autoComplete = jQuery("#EditSelect", mydiv).autocomplete("widget"); var dialogOpts = { modal: true, autoOpen: true, resizable: false, width: 525, height: 'auto', title: 'Edit settings' }; mydiv.dialog(dialogOpts); autoComplete.insertAfter(mydiv.parent());

In this edit dialog is an autocomplete that when selected it should update the other input field (#EditSelect2). Currently #EditSelect2 has the value from the server (in the variable path).

When a new value is selected from the autocomplete I would expect the form updated because of this code: details.val( value );. Right now the autocomplete works fine but the value from the server (path) doesn't get updated after selecting a new choice in the autocomplete.

Hope this makes sense.

Answer1:

There is a small syntax error in your myinput8 statement:

$myinput8 = jQuery("<input id='EditSelect2' name='add_path' value='" +path + " />");

should be:

$myinput8 = jQuery("<input id='EditSelect2' name='add_path' value='" +path + "' />");

Note the extra single quote at the end.

Recommend

  • Android distinguish between tap and double tap
  • netsh acl setting (need alternative method - registry settings?)
  • how do i write assembly code from c#?
  • How to get latest version of a artifact on Bintray using JSONP
  • xcode don't localize specific strings
  • Combining two different ActiveRecord collections into one
  • bad substitution shell- trying to use variable as name of array
  • converting text file into xml using php?
  • wxPython: displaying multiple widgets in same frame
  • Unable to get column index with table.getColumn method using custom table Model
  • Stop Bash Script if Hive Fails
  • C: Incompatible pointer type initializing
  • custom UITableViewCell with image for highlighting
  • Swift: Switch statement fallthrough behavior
  • Google Custom Search with transparent background
  • FFmpeg Conversion Error
  • Why value captured by reference in lambda is broken? [duplicate]
  • Java Scanner input dilemma. Automatically inputs without allowing user to type
  • java.lang.NoClassDefFoundError: com.parse.Parse$Configuration$Builder on below Lollipop versions
  • Obtain ObjectIdHex value from mgo query
  • Volusion's generic SQL folder, functionality
  • How to set/get protobuf's extension field in Go?
  • MySQL WHERE-condition in procedure ignored
  • JSON with duplicate key names losing information when parsed
  • Which linear programming package should I use for high numbers of constraints and “warm starts” [clo
  • Can I have the cursor start on a particular column by default in jqgrid's edit mode?
  • what is the difference between the asp.net mvc application and asp.net web application
  • Web-crawler for facebook in python
  • Rearranging Cells in UITableView Bug & Saving Changes
  • Circular dependency while pushing http interceptor
  • Matrix multiplication with MKL
  • Linker errors when using intrinsic function via function pointer
  • trying to dynamically update Highchart column chart but series undefined
  • How can I get HTML syntax highlighting in my editor for CakePHP?
  • FormattedException instead of throw new Exception(string.Format(…)) in .NET
  • How do I configure my settings file to work with unit tests?
  • How does Linux kernel interrupt the application?
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • Binding checkboxes to object values in AngularJs
  • java string with new operator and a literal