I've got this error message :
Uncaught InvalidStateError: Failed to read the 'selectionDirection' property from 'HTMLInputElement': The input element's type ('hidden') does not support selection.
When I check the console, it says error in this code:
function simpan() {
$.ajax({
url: 'app/tblhasilsurvey/simpan',
type: 'post',
async: false,
data: {
cmd: window.cmd,
id: window.id_hasilsurvey,
id_daftar: window.id_daftar,
id_jadwal: window.id_jadwal,
//tblhasilsurvey_nobasurvey : $("#nomor_ba_survey").val(),
nomor_izin : $("#nomor_izin").val(),
tgl_izin : $("#tgl_izin").val(),
pemilik_izin : $("#pemilik_izin").val(),
lokasi : $("#lokasi").val(),
kodekel : $("#kelurahan").val(),
kodekec : $("#kecamatan").val(),
tblhasilsurvey_tglbasurvey : $("#tgl_ba_survey").val(),
tbldaftarrencanasurvey_koordinat : $("#lattitude_").val()+';'+$("#longitude_").val(), // (lattitude;longitude)
tblhasilsurvey_fungsibangunan : $("#fungsi_bangunan").val(),
tblhasilsurvey_uraianpermasalahan : $("#uraian_permasalahan").val(),
tblizin_id : $("#tblizin_id").val()
},
success: function (data) {
if(data=='success') {
notifikasi('Sukses','Data Berhasil Disimpan', 'success');
//window.location.reload();
} else {
notifikasi('Gagal','Data Gagal Disimpan', 'fail');
}
}
});
if( $("#lattitude_").val() !='' ) window.pos_lat = $("#lattitude_").val(); // jika koordinat terisi maka update posisi lattitude
if( $("#longitude_").val() !='' ) window.pos_long = $("#longitude_").val(); // jika koordinat terisi maka update posisi longitude
$("#peta-lokasi").slideDown(1000);
initialize();
$("html, body").animate({ scrollTop: $(document).height() }, 2500);
return false;
function refresh () {
window.location.reload();
}
}
Can someone explain me what happen here?
I've got this error message :
Uncaught InvalidStateError: Failed to read the 'selectionDirection' property from 'HTMLInputElement': The input element's type ('hidden') does not support selection.
When I check the console, it says error in this code:
function simpan() {
$.ajax({
url: 'app/tblhasilsurvey/simpan',
type: 'post',
async: false,
data: {
cmd: window.cmd,
id: window.id_hasilsurvey,
id_daftar: window.id_daftar,
id_jadwal: window.id_jadwal,
//tblhasilsurvey_nobasurvey : $("#nomor_ba_survey").val(),
nomor_izin : $("#nomor_izin").val(),
tgl_izin : $("#tgl_izin").val(),
pemilik_izin : $("#pemilik_izin").val(),
lokasi : $("#lokasi").val(),
kodekel : $("#kelurahan").val(),
kodekec : $("#kecamatan").val(),
tblhasilsurvey_tglbasurvey : $("#tgl_ba_survey").val(),
tbldaftarrencanasurvey_koordinat : $("#lattitude_").val()+';'+$("#longitude_").val(), // (lattitude;longitude)
tblhasilsurvey_fungsibangunan : $("#fungsi_bangunan").val(),
tblhasilsurvey_uraianpermasalahan : $("#uraian_permasalahan").val(),
tblizin_id : $("#tblizin_id").val()
},
success: function (data) {
if(data=='success') {
notifikasi('Sukses','Data Berhasil Disimpan', 'success');
//window.location.reload();
} else {
notifikasi('Gagal','Data Gagal Disimpan', 'fail');
}
}
});
if( $("#lattitude_").val() !='' ) window.pos_lat = $("#lattitude_").val(); // jika koordinat terisi maka update posisi lattitude
if( $("#longitude_").val() !='' ) window.pos_long = $("#longitude_").val(); // jika koordinat terisi maka update posisi longitude
$("#peta-lokasi").slideDown(1000);
initialize();
$("html, body").animate({ scrollTop: $(document).height() }, 2500);
return false;
function refresh () {
window.location.reload();
}
}
Can someone explain me what happen here?
Share Improve this question edited Dec 26, 2014 at 16:17 Alexander O'Mara 60.6k19 gold badges172 silver badges181 bronze badges asked Dec 26, 2014 at 16:08 ChristChrist 811 gold badge1 silver badge4 bronze badges 1-
Which specific line has the error? Is there a stack trace? The error seems self explanatory; something (maybe not in this code, but in something it calls like
notifikasiorinitialize) is probably trying to readselectionDirectionon a hidden element. – Jacob Commented Dec 26, 2014 at 18:38
1 Answer
Reset to default 14Somewhere in your HTML you have an <input type='hidden' /> which you are trying to add to your data obj, but you are probably adding the jQuery object and this message is likely getting thrown when the jQuery object is being stringified somewhere. Given most of your data object is built by explicitly calling .val() I'd guess the problem lies with one of these:
cmd: window.cmd,
id: window.id_hasilsurvey,
id_daftar: window.id_daftar,
id_jadwal: window.id_jadwal,
try menting those out and see if your error goes away. If it does, then the problem can probably be solved by adding .val() to the end of the problematic line.
EDIT AND EXTENSION
(Apr 9, 2015) This answer has had 3 upvotes since I wrote it, all spread out in time, so I guess other people are hitting this error and finding this answer, so here is a more general explanation to help people out.
This error is thrown if you add the jQuery object representing a hidden input to a JS object, then try to serialise that JS object to JSON.
Demo reproducing the error in its simplest form:
http://jsfiddle/ptugva6t/2/
Using this HTML:
<input type="hidden" id="test1" value="test1_val" />
Then #test1 will trigger the error if we use this JS:
$(document).ready(function() {
var data = {
test1: $("#test1")
}
JSON.stringify(data)
});
whereas this will be OK:
$(document).ready(function() {
var data = {
test1: $("#test1").val()
}
JSON.stringify(data)
});
Whereas if you use a text input you won't hit this error, but you will likely hit other serialisation errors due to the plexity of the object you are trying to serialise!
UPDATE
(7 September 2016) It looks like this was only ever a Chrome bug and it has been fixed in a recent Chrome update. There is now no error at all in Chrome 52 and you can JSON.stringify a jquery object with no problem.
Firefox is also OK. Safari 9.1.1 still throws an error, though - a TypeError on JSON.stringify that can be fixed by adding the .val()
So there's a mini-project arising, to find the Chrome bug report and its fix, and report it to Safari.