How to retrive value from @Html.TextBoxFor in a external javascript file

Question

I am using MVC 4 in my create view i have the following code

@Html.TextBoxFor(model => model.USER_EMAIL, new { @class = "form-control", id="userModelEmail" })
@Html.ValidationMessageFor(model => model.USER_EMAIL)

I have added a reference to my view

<script src="~/Contents/Common.js"></script>

Inside the common.js I want to get the value from the TextBoxFor .I have added the following code in my common.js

$("#btnRegister").click(function () {
    debugger;
    var userData = {
        userEmail: document.getElementById('USER_EMAIL').value(),
        userPassWord: document.getElementById('userModelPwd').value(),
        userConfirmPassword: document.getElementById('userModelCfmPwd').value(),
        userMObile: document.getElementById('userModelMob').value(),    
    }
    debugger;
        $.ajax({
            type: "POST",
            url: 'Home/Register',
            data: '{userDetails:' + JSON.stringify(userData) + '}',
            success: function (res) {
                debugger;
                //  alert("data is posted successfully");
                if (res.success == true) {
                    debugger;
                    $('#modalLogin').modal('show');
                   // window.location.href = window.location.href + res.AdminLocation;
                    debugger;
                } else {
                    document.getElementById("lblInvalidUser").style.display = "inline";
                }
            },
            error: function (xhr, textStatus, errorThrown) {
                alert(xhr.statusMessage);
                return false;
            }
        });

        return true;
});

but at the line of userEmail: document.getElementById('USER_EMAIL').value() the USER_EMAIL is showing cant not resolve I have also tried with the id document.getElementById('userModelEmail').value() here also its showing the id cant be resolve.

How to solve it?

Solution

value is attribute property not a function in DOM.
Change your code as below and try

   var userData = {
        userEmail: document.getElementById('userModelEmail').value,
        userPassWord: document.getElementById('userModelPwd').value,
        userConfirmPassword: document.getElementById('userModelCfmPwd').value,
        userMObile: document.getElementById('userModelMob').value,    
    }

OR with jQuery like below

   var userData = {
        userEmail: $('#userModelEmail').val(),
        userPassWord: $('#userModelPwd').val(),
        userConfirmPassword: $('#userModelCfmPwd').val(),
        userMObile: $('#userModelMob').val(),    
    }