Jquery заставляет дважды щелкнуть, чтобы отправить форму

Question

Странная проблема, когда мне нужно дважды щелкнуть, чтобы отправить свою форму в первый раз, но после первого раза форма отправляется после одного клика!

Вот мой jquery:

<script type="text/javascript"> 
$(document).ready(function() { 
    var options = { 
        target:        '.error_box_wrapper',
        success:       showResponse
    }; 
    // bind form using 'ajaxForm' 
    $('#edit_group_form').live('submit', function() {
        // inside event callbacks 'this' is the DOM element so we first
        // wrap it in a jQuery object and then invoke ajaxSubmit
        $(this).ajaxForm(options); 

        // !!! Important !!!
        // always return false to prevent standard browser submit and page navigation
        return false;
    });
}); 
// post-submit callback 
function showResponse(responseText, statusText, xhr, $form)  {  
    $("#leftside div#groups_container").load('includes/my_groups.php'); 
} 
</script>

Вот моя форма:

 echo "<form id='edit_group_form' action='processforms/process_groups.php' method='POST'>";
 echo "<input name='groupid' type='hidden' value='$groupid' />";
 echo "<input name='image' type='hidden' value='$image' />"; 
 echo "<input type='hidden' name='MAX_FILE_SIZE' value='50000000' />"; 
 echo "<table border=0 width=100%' style='border-left-width: 3px;border-left-style: solid;border-left-color: #ccc; margin-bottom:5px;' class='small_text' >";
 echo "<tr><td valign=top align=right NOWRAP>Group Message:</td>";
 echo "<td valign=top align=left><textarea name='groupmessage' cols=32 rows='3'>$groupmessage</textarea></td></tr>";
 echo "<tr><td valign=top align=right NOWRAP>Group Name:</td><td valign=top align=left><input name='groupname' size='40' value=\"$groupname\"></td></tr>";
 echo "<tr><td valign=top align=right NOWRAP>Group picture:</td><td valign=top align=left><input name='uploadedfile' type='file' /></td></tr>";
 echo "</table>"; 
 echo "<input type='submit' value='Save' name='submit_edit_group_form'/></td><td align=left><a href='?view=mygroups' class='mybutton' id='cancel_link'><b>Cancel</b></a>";
 echo "</form>"; 

Думая, что это может иметь какое-то отношение к .live

Любые идеи очень ценятся .. Спасибо

Answer 1

Вместо ajaxForm измените его на ajaxSubmit. AjaxForm инициализирует форму как форму Ajax, поэтому вам нужно нажать на нее во второй раз.

Насколько я помню, ajaxSubmit использует те же параметры, что и ajaxForm, так что вы можете просто поменять его местами.