JSONP SyntaxError：缺少； 声明前

Question

I have on a controller a function on codeigniter which gets and checks image for my templates.

I have place a id="template" just after my thumbnail bootstrap div id template works with my script code.

Currently when I select theme I get a firebug error

Error Pop Up

SyntaxError: missing ; before statement
OK
{"image":"<img src=\\\"http:\/\/localhost\/codeigniter\/codeigniter-cms\/image\/templates\/default.png\\\" alt=\\\"\\\"\/>"}

Controller Image Function

public function template() {
  $this->load->helper('html');
  if (file_exists(FCPATH . 'image/templates/' . $this->configs->get('config_template') . '.png') == FALSE) {
    $img =  addslashes(img('image/no_image.png'));
    echo json_encode(array('image'=>$img));
  } else {
  if($this->input->post('config_template') !== FALSE) {
    $img = addslashes(img('image/templates/' . basename($this->input->post('config_template')) . '.png'));
    echo json_encode(array('image'=>$img));
   }
  }
}

View

<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data" id="form-setting" class="form-horizontal">

<div class="form-group">
<label class="col-sm-2 control-label" for="input-template"><?php echo $entry_template; ?></label>
<div class="col-sm-10">
<select name="config_template" id="input-template" class="form-control">
<?php foreach ($templates as $template) { ?>
<?php if ($template == $config_template) { ?>
<option value="<?php echo $template; ?>" selected="selected"><?php echo $template; ?></option>
<?php } else { ?>
<option value="<?php echo $template; ?>"><?php echo $template; ?></option>
<?php } ?>
<?php } ?>
</select>


<div class="form-group">
<div class="col-lg-4">
<div class="img-thumbnail">
<div id="template"></div>
</div>
</div>
</div>

</form>

<script>
console.log('Jquery is working');
$('select[name="config_template"]').on('change', function () {
var template_name;
template_name = encodeURIComponent(this.value);
$.ajax({
type: 'POST',
dataType: 'jsonp',
url: '<?=base_url('admin/setting/template');?>'  + '/',
data: { config_template: template_name
},
complete: function () {
$('.fa-spin').remove();
},
success: function (data) {
$('.fa-spin').remove();
$('#template').html(data.image);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
})
</script>

Answer 1

Found out issue it was addslashes

old

public function template() {
  $this->load->helper('html');
  if (file_exists(FCPATH . 'image/templates/' . $this->configs->get('config_template') . '.png') == FALSE) {
    $img =  addslashes(img('image/no_image.png'));
    echo json_encode(array('image'=>$img));
  } else {
  if($this->input->post('config_template') !== FALSE) {
    $img = addslashes(img('image/templates/' . basename($this->input->post('config_template')) . '.png'));
    echo json_encode(array('image'=>$img));
   }
  }
}

new

public function template() {
$this->load->helper('html');
if (file_exists(FCPATH . 'image/templates/' . $this->configs->get('config_template') . '.png') == FALSE) {
$img = img('image/no_image.png');
echo json_encode(array('image'=>$img));
}else
{
if($this->input->post('config_template') !== FALSE)
{
$img = img('image/templates/' . $this->input->post('config_template') . '.png');
echo json_encode(array('image'=>$img));
}
}
}

Answer 2

1. You are outputting JSON. Not JSONP. Change dataType: 'jsonp', to dataType: 'json',
2. Adding slashes to some HTML will break that HTML. You'll be putting \\ characters in your image URLs and making them wrong. Remove all uses of the addslashes function. encode_json will do all the escaping you need.