"Form is not defined" error using jQuery

Question

I am learning jquery and am writing some very simple jquery code that posts some variables to a method in my controller. I get “myform is not defined” error in firebug when using the code posted below.

Here is my html:

<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="assets/js/jquery-1.7.1.js"></script>
    <script type="text/javascript">
        function get(){
            $.post('jqtest/test',{name: myform.myname.value},
            function (output){
                $('#username').html(output).show();          
            }    
        );
        }
    </script>
</head>

<body>
    <div>TODO write content</div>
    <form name="myform">
        <input type="text" name="myname">
        <input type="button" value="Get" onclick="get();">
    </form>
    <div id="username"></div>
</body>

Here is my codeigniter controller code:

class Jqtest extends CI_Controller {

function _Jqtest() {
    parent::controller();
}

function index() {
    $this->load->view("jqtest/jqtest.html");
}

function test() {
    print_r($_POST);
    $this->load->view("jqtest/jqtest.html");
}

}

When the Get button is clicked, the test method should print the POST values. When I run the code in FireFox, it's not working (nothing is getting printed out). When I checked the firebug console, I found a "myform is not defined" error.

I know there is something wrong with my jQuery get() function, can anybody please help me out, thank you very much!

Bhanu Krishnan · Accepted Answer · 2013-06-04 04:04:01Z

3

"myform is not defined" error occures because you have not set myform in javascript.

try Jquery's serializeArray()

var myform= $('form').serializeArray();

function get(){
            $.post('jqtest/test',{name: myform.myname.value},
            function (output){
                $('#username').html(output).show();          
                }   );
}

edited Jun 4, 2013 at 4:04

answered Nov 30, 2011 at 5:29

Bhanu Krishnan

3,7261 gold badge22 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jake Feasel · Accepted Answer · 2011-11-30 05:28:45Z

1

    function get(){
        $.post('jqtest/test',{name: $('form[name="myform"] input[name="myname"]').val()},
        function (output){
            $('#username').html(output).show();          
        }    
    );
    }

answered Nov 30, 2011 at 5:28

Jake Feasel

17k5 gold badges55 silver badges68 bronze badges

1 Comment

Jake Feasel Over a year ago

Good luck on your jquery learning. I suggest also looking into jQuery's event binding : api.jquery.com/category/events

joadha · Accepted Answer · 2011-11-30 05:31:13Z

1

Replace

myform.myname.value

with

$('input[name="myname"]').val()

answered Nov 30, 2011 at 5:31

joadha

1911 silver badge15 bronze badges

Comments

Neelesh · Accepted Answer · 2011-11-30 05:44:22Z

1

You can simply do this :

document.myform.myname.value

answered Nov 30, 2011 at 5:44

Neelesh

1,4783 gold badges13 silver badges20 bronze badges

Comments

Rashidul Islam · Accepted Answer · 2011-11-30 05:49:12Z

1

Form should have an id <form name="myform" id="myformid">

$.post('jqtest/test',{name: myform.myname.value},

would replaced with the below code :)

$.post('jqtest/test',{name: $( 'input[name="myname"]' ).val()},

If u need to send the all form value then u should use serialize. it's faster.

API DOC: serialize

If u use same same input name for different form. then u should have to write as below:

var $form = $( "#myformid" );
name = $form.find( 'input[name="myname"]' ).val();

and post will be:

$.post('jqtest/test',{name: name},

answered Nov 30, 2011 at 5:49

Rashidul Islam

1,7123 gold badges19 silver badges25 bronze badges

Collectives™ on Stack Overflow

"Form is not defined" error using jQuery

5 Answers 5

Comments

1 Comment

Comments

Comments

API DOC: serialize

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related