Question

I have this jQuery code and my form :

<script type="text/javascript">
    $(document).ready(function() {                      
        var customForm=$('#addChartForm').html();   

        $("#addChartForm").delegate("form[name=chartForm]", "submit", function(e){
            e.preventDefault();

            customForm=$('#addChartForm').html();

            ... some AJAX operations ...
        });     
    });
</script>

<div class="main_content_remark" id="addChartForm" style="height:140px;">
    <form method='post' name="chartForm">
        <div class="categoryName">
            <div class="categoryName1">
                Title
            </div>

            <div class="categoryName2">
                <input type="text" maxlength="50" name="title" class="input400" />
            </div>

            <div class="categoryName3">
                <input type="submit" value="Create Chart" />
            </div>                  
        </div>              
    </form>
</div>

I’d like to store into the variable customForm the form code and all data inserted by the user in the input box.

For the code I mean the form HTML. In fact, with $(‘#addChartForm’).html() I get it, but in addiction (and that’s the problem) I’d like to get the data inserted by the user

Is it possible? how can I do this?

Answer 1

You could do something like this to store the data in an object…

<script type="text/javascript">
    $(document).ready(function() {                      
        var customForm = {
            html: $('#addChartForm').html(); 
            input400: $('#input400').val();
        };     
    });
</script>

Then reference the html like this

customForm.html

and the input value like this

customForm.input400