How to check image exist on server using JQuery Ajax

Sometimes you need to check whether resource is available on the server or not to show it on web page. For instance if you want to show image on your web page but you don't know whether it exists or not on server. How do you check that using Javascript or JQuery??

Well there is a way, using simple & small jquery/ajax code you can achieve that.

Here is the example:

 function IsImageExists(imageUrl){
  var result;  
  $.ajax({
       url: imageUrl,
       type:'HEAD',
       async: false,
       success: function(res){
        result=true;        
       },
       error:function(error){
        result=false;        
       }
  });
  return result;
 }
 
 var url="http://localhost:8080/myproject/images/myimg.png";
 var result=IsImageExists(url); 
 
 if(result == true){
  console.log("Image Exists");  
 }else{
  console.log("Image Not found");
 }

Hope it works. Thanks..!!

Dynamic state city dropdown selection in Yii Framework

Here is the tutorial to select city from state id dynamically by using ajax in Yii Framework in 3 easy steps

1) Fetch all state name and state id from "State" table and show it in dropdown field

<?php 
$stateList = CHtml::listData(State::model()->findAll(array('order' => 'name')), 'state_id', 'name');
        echo $form->dropDownList($model, 'state_id', $stateList, array(
            'ajax' => array(
                'type' => 'POST', //request type
                'url' => CController::createUrl('ajax/getCities'), //url to call.                
                'update' => '#Address_city_id', //selector to update   
                'data' => array('state_id' => 'js:this.value'),
        )));
?>

Here I have added the 'ajax' array in dropdownlist field where:

- type is type of request i.e. POST/GET

- url is controller and action url to call (Here I have called the AjaxController's getCities() method)

- update is the selector to update i.e. city dropdownlist id

- data is state_id to send request to particular controller/action

This will generate the following HTML output:

<select id="Address_state_id" name="Address[state_id]">
<option value="1">Andaman & Nicobar</option>
<option value="2">Andhra Pradesh</option>
<option value="3">Arunachal Pradesh</option>
.
.
</select>

Here "value" field contains the state id and option name as state names

2) Create city dropdown field

<?php
echo $form->dropDownList($model, 'city_id');
?>

This will generate the following HTML output:

<select id="Address_city_id" name="Address[city_id]">
<option value="1">Kolhapur</option>
<option value="2">Ahmednagar</option>
.
.
</select>

3) In controller i.e AjaxController -> actionGetCities() method

<?php
class AjaxController extends Controller {

    public function actionGetCities() {        
    //Fetch all city name and id from state_id
        $data = City::model()->findAll('state_id=:id', array(':id' => (int) $_POST['state_id']));        
    //Passing city id and city name to list data which generates the data suitable for list-based HTML elements
        $data = CHtml::listData($data, 'city_id', 'name');
    //CHtml::tag which generates an HTML element
        foreach ($data as $value => $name) {            
            echo CHtml::tag('option', array('value' => $value), CHtml::encode($name), true);
        }
    }
}
?>

Thats it! Hope this will help you.