Pemrograman

Bahasa

Framework

Peralatan

Info

Masalah `SyntaxError: unterminated string literal` pada Javascript

– 15 September 2016
Sebuah masalah kecil saya temukan pada proyek yang sudah jadi. Bisa dibilang, web tersebut sudah jadi dan siap di-hosting. Tapi ternyata ada sedikit error yang membuat salah satu fitur tidak bekerja.

Jadi ceritanya, saya ingin menampilkan detail produk dengan modal. Data produknya diambil dari parameter yang dikirim ke dalam fungsi detail().
Detail produk pada modal
Kode fungsi detail() untuk menampilkan modal produk:
function detail(data){
    console.log(data);
    $("#myModalLabel").html(data.nama);
    $("#gambar-produk").attr("src", data.foto);
    $("#harga").html(data.harga);
    $("#keterangan").html(data.keterangan);
    
    $("#modal-detail-produk").modal('show');
}
Parameter data berupa objek yang diambil dari event onclick elemen. Berikut ini kode HTML elemenya:
<div class="panel panel-default">
    <div class="panel-body"><img src="http://localhost/tangsi/assets/tjc/img/produk/6nzxid5jljt9.jpg" class="img-responsive" style="width:100%" alt="Image" onclick="detail({
            'id': '6nzxid5jljt9',
            'nama': 'Continous Form',
            'harga': '',
            'jenis': 'barang',
            'keterangan': '<p>1ply / 2ply / 3ply Model Faktur / Wartel</p>',
            'foto': 'http://localhost/tangsi/assets/tjc/img/produk/6nzxid5jljt9.jpg'
          })"></div>
    <div class="panel-footer">Continous Form</div>
</div>
Atribut 'keterangan' pada objek data tersebut isinya berupa HTML. Masalah mulai timbul ketika kode HTML-nya semakin kompleks. Contohnya seperti ini.
Dari gambar di atas, saya dapat mengetahui penyebab timbulnya error "SyntaxError: unterminated string literal." Kode HTML tersebut dihasilkan dari sebuah printah PHP.

Berdasarkan penelusuran saya, sebuah jawaban di Stack Overflow memberikan kode untuk menghilangkan white space di kode HTML dengan PHP. Berikut ini kodenya:
<?php
$output = str_replace(array("\r\n", "\r"), "\n", $output);
$lines = explode("\n", $output);
$new_lines = array();

foreach ($lines as $i => $line) {
    if(!empty($line))
        $new_lines[] = trim($line);
}
echo implode($new_lines);
Kode tersebut bisa saya terapkan pada proses input dan edit data produk. Karena pada input dan edit produk untuk keterangan saya menggunakan TinyMCE. Selain itu juga dengan meletakkan di input dan edit, akan hemat ruang di database.

Selanjutnya, kode di atas saya modifikasi menjadi sebuah fungsi yang saya taruh di Controller Produk.
Penerapan Kode untuk menghilangkan whitespace di Codeigniter
Hasilnya:

Sebelum menerapkan kode:

Setelah kode diterapkan:


Referensi:

No comments :

Post a Comment