form.submit() to a specific DIV

Question

I want to submit a form using Javascript and jQuery to specific div but I can't work out how to do it.

This code below works, submitting the form to the header of the current page.

    var form,
        chart = this,
        svg = chart.getSVG(chartOptions);

    // merge the options
    options = merge(chart.options.exporting, options);

    // create the form
    form = createElement('form', {
        method: 'post',
        action: options.url
    }, {
        display: NONE
    }, doc.body);

    // add the values
    each(['filename', 'type', 'width', 'svg'], function(name) {
        createElement('input', {
            type: HIDDEN,
            name: name,
            value: {
                filename: options.filename || 'chart',
                type: options.type,
                width: options.width,
                svg: svg
            }[name]
        }, null, form);
    });

    // submit
    form.submit();

    // clean up
    discardElement(form);

I have tried various options but nothing has worked. In simple terms I want to do this:

$('#myDiv').form.submit();

Or in other words, send the submit command to the div named myDiv.

Does anyone know how I would do this? Thanks.

You can't `submit` a `div`. You can only `submit` a `form`, and your own example has `form.submit()`, so it's not clear what the question is. — Jonathan Julian, Oct 19 '11 at 11:06
possible duplicate of [Post form in JQuery and populate DIV - broken in IE](http://stackoverflow.com/questions/717703/post-form-in-jquery-and-populate-div-broken-in-ie) — mplungjan, Oct 19 '11 at 11:21
okay, to explain further. On the ready event of the document I want this form to be automatically submitted. The form params create a chart on a server and send back a PNG image. I am then using php to get the contents of the PNG and save it. Therefore this `form.submit` needs to run in the background, not to the header of the page, so I want to submit the form into a hidden div on the page where my php is located. Hope that makes sense now. — user783322, Oct 19 '11 at 11:30

score 1 · Accepted Answer · edited May 23 '17 at 10:34

1

You should be able to use the code given here:

Post form in JQuery and populate DIV - broken in IE

$.ajax({
  url: options.url,
  type: 'POST',
  cache: false,
  data: {
            filename: options.filename || 'chart',
            type: options.type,
            width: options.width,
            svg: svg
        },
  dataType: 'text',
  complete: function(xhr, textStatus) {
    alert('completed');
  },
  success: function(data) {
    $("#myDiv").html(data);
  },
  error: function(xhr, textStatus, errorThrown) {
    alert('woops');
  }
});

edited May 23 '17 at 10:34

Community

1
1

answered Oct 19 '11 at 11:25

mplungjan

169,008
28
173
236

Thanks very much for the solution. It took me 8 hours to solve that one :) – user783322 Oct 19 '11 at 15:44

score 0 · Answer 2 · answered Oct 19 '11 at 10:53

0

$('#myDiv').click (function () {
$("form").submit();
});

answered Oct 19 '11 at 10:53

Royi Namir

144,742
138
468
792

Thanks but its not a click event. This event takes place as part of a load of stuff @ `$(document).ready`. – user783322 Oct 19 '11 at 10:58

form.submit() to a specific DIV

2 Answers2