ruby on rails - modal forms using jquery and railse -

What is the best option for creating model / overlay type form (for example a post) using rail and jquery is?

I've tried jquery UI dialog / jquery tool overlays etc, but do not seem to be a good solution to handle ..

1 - Forms with validation errors, i.e. Present Inline / Flash Verification Errors

2 - The only way to handle them is to reload the dialog and there is some complicated juskinting, which I'm not sure it will degrade properly.

Just curious, what do the people you used to do, it's simple and unimportant?

This seems to be about two decisions in comparison to your question:

1 - Which approach is to use for Ajax form?

2 - Which tool or approach to use for a model form?

I use RJS with a model form and UJS approach. This is a live example of update.js.haml with Flash messages and inline errors:

  $ ('# Flash'). Children () Slideshow (); $ ('# Flash'). Html ('# {escap_javascript (' layout / partial / flash ',' flash => flash)} ''). Slidedown (); $ ('# Flash') Kids () Delay (flash_delay) .slideUp () .. - If @variant.errors.any? $ ('# Data_form'). Html ('# {escape_javascript (render (: partial = & gt; "form"))}'); - Other modalform.clos (); $ ('Ul.data_grid .list li [id = "# {@ variant.id}"]'). Replacewith ('# {escape_javascript (render: partial = & gt; "variant" ,: local = & gt; {variant = & gt; @variant}}}'; ModalForm.init ();  

I found that rendering form with partially using error is very simple and you can reuse your code. Code above 2 application-wide JavaScript modes for modal form: off and init :

var ModalForm = {init: function () {$ ('a.show_modal'). Overlay ({mask: {color: '# 335f97', load speed: 100, Opacity: 0.5}, close onclick: false, target: '#modal_form', Fixed: incorrect, left: 135, top: 0, but closed: function () {$ ('#data_form') empty ();}});}, close: function () {$ ('a.show_modal') Each (function () {var ol = $ (this) .data ("overlay"); if (ol.isopened ()) {ol.close ();}}};}}; $ (document) .ready (Function () {ModalForm.init ();});

There is only one issue with the above code: The modal form is greater than the visible part of the screen (when the overlay is fixed) Or parent documents (when the overlays do not work well)

String it, adjust it Area and is not working hard to restore the original height of the original element.