jQuery val() returns empty though element.value returns value

Question

I have a JavaScript issue that appears sometimes and sometimes not (inconsistent behavior) ... I can see on Chrome console that when the issue happens, the code:

alert( document.getElementById('F_GCEO_MEETING_DATE').value);

returns value while the code:

var meetingDate22 = $("input[name='F_GCEO_MEETING_DATE']").val();
alert(meetingDate22);

that I am using in the code returns empty... this empty string is causing the issue... can any one help with the reason?

Answer 1

Double check that you are not assigning the #F_GCEO_MEETING_DATE id to more than one element.

Ensure jQuery has finished initializing and that the #F_GCEO_MEETING_DATE element has been added to the dom:

$(function(){
    var meetingDate22 = $("input[name='F_GCEO_MEETING_DATE']").val();
    alert(meetingDate22);
});

Answer 2

If you work in your code below your context.

alert( document.getElementById('F_GCEO_MEETING_DATE').value);

That is use id not the name .If your attribute is name then it didn't work.

document.getElementsByName('F_GCEO_MEETING_DATE')[0].value)  //is work for your name.

Therefore, correct your code $("#F_GCEO_MEETING_DATE") instead of $("input[name='F_GCEO_MEETING_DATE']")

In addition, pure javascript would catch error if you set id is F_GCEO_MEETING_DATE and get the F_GCEO_MEETING_DATE of name .

Answer 3

Try this:

var meetingDate22 = $("input[name=F_GCEO_MEETING_DATE]").val();
alert(meetingDate22);

I think you should not use quotes after name

Answer 4

Try using the ID instead of the name, like this:

var meetingDate22 = $("#F_GCEO_MEETING_DATE").val();
alert(meetingDate22);