Results 1 to 6 of 6

Thread: jQuery post

  1. #1
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default jQuery post

    i have a simple post that works when i assign the click to an anchor but not to the forms submit. also when i take the post out of the submit wrapper it works but the click from the form isnt. i must be overlooking something simple!!
    any help would be appreciated
    Code:
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    	
    	//$("a").click(function() {//this works
    	$("#myform").submit(function() {// this doesnt
    		//$.post('process.php', $("#myform").serialize(), function(data) {
    		$.post( 'process.php', function( data ) {
    			 $('#results').html(data);
    		  });
    
    	});//myform
    
    });
    </script>
    
    </head>
    <body>
    <a style="cursor:pointer;">click</a>
    <form name="myform" id="myform" action="">  
    <!-- The Name form field -->
        <label for="name" id="name_label">Name</label>  
        <input type="text" name="name" id="name" size="30" value=""/>  
    	<br>
    <!-- The Email form field -->
        <label for="email" id="email_label">Email</label>  
        <input type="text" name="email" id="email" size="30" value=""/> 
    	<br>
    <!-- The Submit button -->
    	<input type="submit" name="submit" value="Submit"> 
    </form>
    <!-- We will output the results from process.php here -->
    <div id="results"><img src='red.jpg'/><div>
    </body>
    </html>
    process.php
    Code:
    <?php
    	//print "Form submitted successfully: <br>Your name is <b>".$_POST['name']."</b> and your email is <b>".$_POST['email']."</b><br>";
    	echo "<img src='grey.jpg'/>";
    ?>
    Last edited by ggalan; 10-06-2011 at 12:47 PM.

  2. #2
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default

    two things:
    Code:
    $("#myform").submit(function() {
    		$.post( 'process.php', $(this).serialize(), function( data ) {
    			$('#results').html(data);
    		});
    		return false;
    	});

  3. #3
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    thank you. what does return false; do?
    re:
    http://stackoverflow.com/questions/8...-in-javascript


    also this doesnt work
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

    but this does
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>


    weird
    Last edited by ggalan; 10-06-2011 at 12:47 PM.

  4. #4
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default

    return false; prevents the default ("normal") action from happening; in this case, the normal form submission (which would take us away from the page that we're dealing with).

    Regarding your script URL, sorry! --since you said that the .click() function was working, I assumed you had a link the jquery elsewhere on your page. jQueryUI is like an "extension" for jQuery; it doesn't include jQuery itself. It's basically a bunch of common user interface methods (like tabbed content, drag-and-drop, accordians, etc.). I don't like it, generally; I think it's too heavy.

  5. The Following User Says Thank You to traq For This Useful Post:

    ggalan (10-06-2011)

  6. #5
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    that was totally my mistake, i overlooked the "ui"
    Code:
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    is there a work around, to not include jQueryUI and still get the same benefits?

  7. #6
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 517 Times in 503 Posts
    Blog Entries
    5

    Default

    you mean the benefit of the UI methods? not directly. there are plug-ins that have much of the same functionality, but you'd need to install them individually (and, of course, find them).

    Most of the time, however, I only need one or two methods from the set, so it's not a problem getting it done separately. In addition, I find that the main jQuery library is usually more than enough to accomplish whatever functionality I need.

    In your case, you're not using anything (in the code you posted) from the jQuery UI anyway.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •