Peter Elias
Peter Elias

Reputation: 317

jquery and wordpress does't work

I am trying to load a jquery function to my wordpress

here is what I did

in function.php added the below code

function my_city_script() {         
    wp_enqueue_script( 'city-script', '/cities.js', array ( 'jquery' ), 1.1, true);
}
add_action( 'wp_enqueue_scripts', 'my_city_script' );

my cities.JS file as below

(function($) {
$("#sel_State").change(function() {
  $("#sel_City").load("load_cities.php?choice=" + $("#sel_State").val());
})

})( jQuery );

and to a page inside my wordpress coded as below

<select id="sel_State" name="sel_State" aria-labelledby="State-ariaLabel" class="required" title="State. *">
      <option value="Alabama">Alabama</option>
      <option value="Alaska">Alaska</option>
      <option value="Arizona">Arizona</option>
       ... etc
</select>
<select id="sel_City" name="sel_City" class="required" title="City. *">
</select>

beside a php file to load cities as below

include '../DBConfig.php';
$choice = $_GET['choice'];
$sql = "SELECT distinct city FROM zy_virtualuser WHERE state ='$choice' order by city"; 

$result = $conn->query($sql);

if ($result->num_rows > 0) {
    while($row = $result->fetch_assoc()) {
        echo "<option>" . $row['city'] . "</option>";
    }
} 

$conn->close(); 

everything works perfectly outside wordpress, but in wordpress 2 issues faced 1- nothing on change event loaded to cities. 2- it's very slow to load when change to any state.

Upvotes: 1

Views: 56

Answers (1)

Ahmed Ginani
Ahmed Ginani

Reputation: 6650

Check if you have included the jQuery twice.

Also you can remove true from wp_enqueue_script and check the jQuery conflict. Also change the version number.

function my_city_script() {         
    wp_enqueue_script( 'city-script', '/cities.js', array ( 'jquery' ), 1.1.1);
}
add_action( 'wp_enqueue_scripts', 'my_city_script' );

Upvotes: 1

Related Questions