CODEWITHSUNDEEP
javascriptjquery
panthro
panthro

Reputation: 24061

serialize() is not working with my form

I'm having trouble serializing my form's data. Code below. Console just logs blank.

HTML:

<div id="sm-log-in">
<form>
    <div class="row">
        <div class="small-12 medium-4 small-centered columns">
            <div class="row">
                <div class="medium-2 columns">
                    <label for="username" class="inline">Username:</label>
                </div>
                <div class="medium-10 columns">
                    <input type="text" id="username" placeholder="Username">
                    <!--<small class="error">A username is required.</small>-->
                </div>
            </div>
            <div class="row">
                <div class="medium-2 columns">
                    <label for="password" class="inline">Password:</label>
                </div>
                <div class="medium-10 columns">
                    <input type="password" id="password" placeholder="Password">
                    <!--<small class="error">A password is required.</small>-->
                </div>
            </div>
            <div class="row">
                <div class="columns">
                    <input id="remember-me" type="checkbox" class="right"><label for="remember-me" class="right">Remember Me</label>
                </div>
            </div>

             <div class="row">
                <div class="columns">
                    <button type="submit" class="small right">Log In</button>
                </div>
            </div>

        </div>
    </div>
</form>

JS:

$('#sm-log-in form').submit(function(e){
    e.preventDefault();      
    console.log($( this ).serialize());
    //etc

Upvotes: 0

Views: 40

Answers (2)

lshettyl
lshettyl

Reputation: 8171

Please add "name" attributes to each input element, like below:

<input type="text" id="username" name="username" placeholder="Username">

<input type="password" id="password" name="password" placeholder="Password">

Upvotes: 0

yoozer8
yoozer8

Reputation: 7489

Form fields need to have a name attribute. This is how the values are keyed. The serialize method pairs the name of each input with its values. Since none of them have any names, none of them are included.

Upvotes: 1

Related Questions