Create a form inside AJAX success call back

I am using getJSON to populate form elements inside function(data) {...} by concatenating html.

What is the best way to create dynamic HTML Form inside the succe开发者_开发知识库ss call back of getJSON.

I should be able to enable/show divs/UI elements based on button clicks in this form.

Thanks

You can easily create HTML using jQuery with the following pattern:

var successFunc = function(json) {
  form = $('<form>').attr('method', 'get');
  form.append($('<input>').attr({'type': 'text', 'val', 'jquery rocks'});
  form.appendTo(document.body);
}

Or more specifically:

//assume json = { resultDiv: '.myResultDiv', value: 'this is an input' };

$.ajax({ ...
  success: function(json) {
    form = $('<form>').attr('method', 'get');
    form.append($('<input>').attr({'type': 'text', 'val', json.value});
    form.appendTo($(json.resultDiv));
  }
}

Hope this helps!

It would be better to create the dynamic content and show it in an Pop-up. If u would explain a bit through code it would be nice and you will get a quicker response.