Support » Plugin: Contact Form 7 City Field Extension » More than one city

  • I am having an issue where the plugin works fine for one city but not a second input. My contact form is for a moving company and has a city from and a city to input. The plugin auto completes the first input fine but does not seem to work for the second input field.

    Here is a small section of the code I am having trouble with:
    <tr>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *From City: (required)</h4>[cityfieldtext* cityfrom]
    </td>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *To City: (required)</h4>[cityfieldtext* cityto]
    </td>
    </tr>

    The cityfrom input works fine but the cityto input does not work. Am I doing something wrong or does this plugin not allow for multiple inputs?

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hello, sorry my English.

    I was able to solve the problem by following the steps below.

    Edit the file located in the:
    wp-content/plugins/contact-form-7-city-field-extension/contact-form-7-city-field-extension.php line 159

    of
    $atts['id'] = 'autocomplete';

    for
    $atts['id'] = $tag->get_id_option();

    Then edit the file that performs the Autocomplete
    File location: wp-content/plugins/contact-form-7-city-field-extension/js/script.js

    Replace all content for:

    
    window.onload=function initialize_pfce() {
    	// Create the autocomplete object and associate it with the UI input control.
      	autocomplete = new google.maps.places.Autocomplete(
        /** @type {HTMLInputElement} */
        	(document.getElementById('autocomplete')),{
            	types: ['(cities)'],
        	}
        );
    
        autocomplete2 = new google.maps.places.Autocomplete(
        /** @type {HTMLInputElement} */
        	(document.getElementById('autocomplete2')),{
            	types: ['(cities)'],
        	}
        );
    }
    

    So just in your shortcodes in contact form 7, insert the attribute id: autocomplete and id: autocomplete2

    <tr>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *From City: (required)</h4>[cityfieldtext* cityfrom id:autocomplete]
    </td>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *To City: (required)</h4>[cityfieldtext* cityto id:autocomplete2]
    </td>
    </tr>
    • This reply was modified 2 years, 6 months ago by wylker.

    Hello, sorry my English, I’m from Brazil.

    I was able to solve the problem by following the steps below.

    Edit the file located in the:
    wp-content/plugins/contact-form-7-city-field-extension/contact-form-7-city-field-extension.php line 159

    of
    $atts['id'] = 'autocomplete';

    for
    $atts['id'] = $tag->get_id_option();

    Then edit the file that performs the Autocomplete
    File location: wp-content/plugins/contact-form-7-city-field-extension/js/script.js

    Replace all content for:

    
    window.onload=function initialize_pfce() {
    	// Create the autocomplete object and associate it with the UI input control.
      	autocomplete = new google.maps.places.Autocomplete(
        /** @type {HTMLInputElement} */
        	(document.getElementById('autocomplete')),{
            	types: ['(cities)'],
        	}
        );
    
        autocomplete2 = new google.maps.places.Autocomplete(
        /** @type {HTMLInputElement} */
        	(document.getElementById('autocomplete2')),{
            	types: ['(cities)'],
        	}
        );
    }
    

    So just in your shortcodes in contact form 7, insert the attribute id: autocomplete and id: autocomplete2

    <tr>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *From City: (required)</h4>[cityfieldtext* cityfrom id:autocomplete]
    </td>
    <td class=”tablephone”><h4 style=”color:#fff;”>
    *To City: (required)</h4>[cityfieldtext* cityto id:autocomplete2]
    </td>
    </tr>
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘More than one city’ is closed to new replies.