How can I return a html view from an ajax call in Laravel 5.1? - ajax

Question

I am trying to render an html view via ajax call and in success callback i will add this html to DOM.But i am not getting any response in the success callback.
public function create()
{
$format = new ProductFormat();
//return response()->view('cms.formats.create_modal', compact('format'));
return (String) view('cms.formats.create_modal', compact('format'));
}
$.ajax({
dataType: 'json',
method: 'GET',
type: 'html',
url: '{{ url("admin/formats/create") }}',
success: function (data) {
alert(data);
console.log(data);
$('#format_modal').html(data);
$('#add_edit_format_modal').modal('show');
}
}).error(function(e){
console.log(e);
});
error callback is getting the html response but why not in success call back?
my response is:
<div class="modal fade" id="add_edit_format_modal" tabIndex="-1">
<div class="modal-dialog">
<div class="modal-content"> <!--start modal content-->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×
</button>
<h4 class="modal-title">Product Format</h4>
</div>
<!--start modal body-->
<div class="modal-body">
<div class="form-horizontal" role="form" id="add_format">
<div class="form-group">
<label for="format_title_en" class="col-md-3 control-label">Title (en)</label
>
<div class="col-md-6">
<input id="format_title_en" value="" name="format_title_en" class="form-control"
type="text" required="required">
</div>
</div>
<div class="form-group">
<label for="format_title_fr" class="col-md-3 control-label">Title (fr)</label
>
<div class="col-md-6">
<input id="format_title_fr" value="" name="format_title_fr" class="form-control"
type="text">
</div>
</div>
<div class="form-group">
<label for="barcode" class="col-md-3 control-label">Barcode</label>
<div class="col-md-6">
<input id="barcode" value="" name="barcode" class="form-control" type="number"
>
</div>
</div>
<div class="form-group">
<label for="packaging_type" class="col-md-3 control-label">Packaging Type</label
>
<div class="col-md-6">
<select class="form-control" id="format_packaging_type" name="packaging_type"
>
<option value="">Other</option>
<option value="bottled">Bottled</option>
<option value="canned">Canned</option>
</select>
</div>
</div>
<div class="form-group">
<label for="amount_g" class="col-md-3 control-label">Size (g)</label>
<div class="col-md-6">
<input id="amount_g" value="" name="amount_g" class="form-control" type="number"
onkeydown="validateNumberAllowDecimal(event, true)">
</div>
</div>
<div class="form-group">
<label for="amount_ml" class="col-md-3 control-label">Size (ml)</label>
<div class="col-md-6">
<input id="amount_ml" value="" name="amount_ml" class="form-control" type
="number" onkeydown="validateNumberAllowDecimal(event, true)">
</div>
</div>
<div class="form-group">
<label for="size_indicated_amount" class="col-md-3 control-label">Size Indicated
Amount</label>
<div class="col-md-6">
<input id="size_indicated_amount" value="" name="size_indicated_amount" class
="form-control" type="number" onkeydown="validateNumberAllowDecimal(event, true)">
</div>
</div>
<div class="form-group">
<label for="size_indicated_unit" class="col-md-3 control-label">Size Indicated
Unit</label>
<div class="col-md-6">
<input id="size_indicated_unit" value="" name="size_indicated_unit" class
="form-control" type="text">
</div>
</div>
<div class="form-group">
<label for="store_code" class="col-md-3 control-label">Store Code</label>
<div class="col-md-6">
<input id="store_code" value="" name="store_code" class="form-control" type
="number">
</div>
</div>
<div class="form-group">
<label for="price" class="col-md-3 control-label">Price</label>
<div class="col-md-6">
<input id="price" value="" name="price" class="form-control" type="number"
>
</div>
</div>
</div>
</div> <!--end modal body-->
<div class="modal-footer">
<button type="button" class="btn btn-success" id="save_product_format">
Save
</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div> <!--end modal content-->
</div>
</div>