Question

I have the below form in my ColdFusion page:

<form name="adminsignin" action="swipelogin.cfm" method="POST">
    <input type="password" class="rounded" name="adminpin" id="adminpin">
    <input type="submit" value="Sign In" name="adminpinbutton" id="adminpinbutton">
</form>

On click of the button, I submit the form using JQuery as below:

$("#adminpinbutton").click(function(e) {
        e.preventDefault();
        if ($.trim($('#adminpin').val()).length > 0) {
            $.ajax({
                type: 'POST',
                url: 'swipelogin.cfm',
                data: $('#adminsignin').serialize(),
                success: function(data, textStatus) {
                    $('#inputarea').replaceWith($('#inputarea', $(data)));
                },
                error: function(xhr, status, e) {
                    alert(status, e);
                }
            });
        } else {
            alert("PIN missing or Incorrect.");
        }
    });

The problem is that in the swipelogin.cfm page, I am not able to access the form’s input element.
I’ve tried form.adminpin and it doesn’t work. Am I missing something?

Edit: swipelogin.cfm code

<cfoutput>#form.adminpin#</cfoutput>
<cfif (#isDefined("form.adminpin")#) OR (#isDefined("session.isadmin")# AND #session.isadmin# eq "true")>

This works perfectly fine if I use cfform instead of form.

Edit 2:
I just tried $("#adminsignin").submit(); instead of a $.ajax. That gives me the form data in the ColdFusion page. This means the issue is with the Jquery.ajax() and not the ColdFusion page.

Answer 1

Your selector for selecting the form to get it’s data is wrong, you need to either select the form by name

$("form[name=adminsignin]")

or give it the id you are targeting

<form id="adminsignin" ...>