Question

I can only insert my code on the body of the page. I need to submit form via Ajax and send strings to server app. So i use jQuery form plugin. This is a code that i try to add:

<script src='http://somesite.ru/interactive/jquery-1.8.3.min.js'></script>
<script src='http://malsup.github.io/min/jquery.form.min.js'></script>
<link rel='stylesheet' type='text/css' href='http://somesite.ru/interactive/somesite_interactive.css'>
<div id='question_block'>
  <b>You can left your question at the form right here:</b>
  <form action='http://somesite.ru/interactive/question' id='interactive_form'>
    <span>Your name:</span><input type='text' name='sender' size='64'>
    <textarea name='question_text'></textarea>
    <input type='button' id='interactive_submit_question' value='Отправить'>
  </form>

  <script type='text/javascript'>
    $("#interactive_submit_question").click(function(){
      $("#interactive_form").ajaxSubmit();
      $("#interactive_question_block").html("<b>Thanks! Your question was submited successfully.</b>");
    });
 </script>

I don't get any errors while page is loading, but when i click the button i got

"TypeError: $(...).ajaxSubmit is not a function".

But i just import the form plugin with

<script src='http://malsup.github.io/min/jquery.form.min.js'></script>

Update:
Looks like the problem is that at this page already loaded jQuery (2 times) and old version of form plugin.
I just used a simple function $.post() to send data to my server.

Was it helpful?

Solution

why not just use $.ajax? just as easy, and you have more control over what gets submitted.

OTHER TIPS

Do you really need ajaxSubmit method? You can try this:

<script type='text/javascript'>
    $(document).ready(function() {
        var helper = {};
        helper.parseFormData = function parseFormData(form) {
            var json = {};
            form.find("[name]").each(function() {
                var _name = $(this).attr("name")
                    , _value = $(this).attr("value");

                json[_name] = _value;
            });

            return json;
        };
        helper.submitForm = function submitForm(form, callback) {
            var _data = helper.parseFormData(form)
                , _url = form.attr("action")
                , _type = form.attr("method");

            $.ajax({
                type: _type,
                url: _url,
                data: _data,
                success: function(content, p2, p3) {
                    callback(content);
                },
                error: function(p1, p2, p3) {
                    callback(null);
                }
            });
        };


        // submit form on button click
        $("#interactive_submit_question").click(function(){
            helper.submitForm($("#interactive_form"), function() {
                $("#interactive_question_block").html("<b>Thanks! Your question was submited successfully.</b>");
            });
        });
    });
</script> 
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top