• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 295
  • Last Modified:

Another jQuery issue

Sorry, but Im really stuck trying to finish a web page.

Ive got a simple form:-
<div id="contentBody">
    <form id="frmSaveUser" action="_userEdit-Save.php" method="POST">
        Username: <input type="text" name="user" value="" /><br/>
        <input type="submit" value="Save" />
    </form> 
</div>

Open in new window


And then some code to change the contents of the div to say saving, and then to put the response of the form in:-
<script type="text/javascript">
    $(document).ready(function() {
        $('#frmSaveUser').ajaxForm(function() {
            beforeSubmit: function() {
                $('#contentBody').html('Saving Results...');
            },
            success: function(data) {
                $('#contentBody').html(data);
            }
        });
    });
</script>

Open in new window


However my code never seems to run, instead the form just runs as normal.

Im working on completing this page tonight, stuck and really would appriciate some assistance with this again.

Thank you
0
tonelm54
Asked:
tonelm54
  • 4
  • 3
1 Solution
 
tonelm54Author Commented:
Ok, reading more I understand that I cannot use ajaxForm without putting in another plugin.

So I have redone my code to do a similar thing:-
<script type="text/javascript">
    $(document).ready(function() {
        $('#frmSave').click(function() {
            var frmData = $("#emailForm").serialize();
        
            $('#modal_body').html("Submitting");        
            $('#frmSaveUser').post("_userEdit-Save.php", frmData, 
                function(data) { 
                    $('#modal_body').html(data);
                });  
           });
        });
</script>

Open in new window


The page _userEdit-Save.php just returns OK, so I would have thought it would put OK into #modal_body but it doesnt seem to run.

Does anyone know what I can do?

Thank you
0
 
Chris StanyonCommented:
I take it you're including the jQuery form plugin in your page!

http://jquery.malsup.com/form/
0
 
tonelm54Author Commented:
Good evening,
I wasn't but dont want to include another plugin, so thought Id do it myself.

My current code is:-
    <form id="frmSaveUser">
        Username: <input type="text" id="user" name="user" value="username" /><br/>
        <div id="frmSave">Save</div>
    </form> 

<script type="text/javascript">
    $(document).ready(function() {
        $('#frmSave').click(function() {
            var frmData = $("#frmSaveUser").serialize();
        
            $('#modal_body').html("Submitting");        
            $('#frmSaveUser').post("_userEdit-Save.php", frmData, 
                function(data) { 
                    $('#modal_body').html(data);
                });  
           });
        });
</script>

Open in new window

0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
Chris StanyonCommented:
Something like this:

$('#frmSaveUser').submit(function() {
    $('#modal_body').html("Submitting");
    $.ajax({
		type: "POST",
		url: $(this).attr('action'),
		data: $("#frmSave").serialize(),
		dataType: "text",
		success: function (data) {
			$('#modal_body').html(data);
		}
    });
});

Open in new window

0
 
Chris StanyonCommented:
The code I psoted assumes you are submitting your form by clicking on a submit button (as in your first post) but your second post indicates you are wanting to post the form when you click a DIV!

Also, you call the post() function on the jQuery object, as in:

$.post(url, data, function(data) { }
0
 
tonelm54Author Commented:
Ok, so looking at your code, Ive done the following:-
   $(document).ready(function() {
        $('#frmSave').click(function() {
            var frmData = $("#frmSaveUser").serialize();
        
            $('#frmSaveUser').post("_userEdit-Save.php", frmData, function(data) { $('#modal_body').html(data); });
        });

Open in new window


But still nothing :-(
0
 
Chris StanyonCommented:
You need to call the post function on the jQuery object:

$.post("_userEdit-Save.php", frmData, function(data) { $('#modal_body').html(data); });
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now