dynamic dropdown populate in haml - ruby-on-rails

I have two dropdowns and a submit button on a rails form HAML page. I would like dropdown 2's content be populated dynamically based on dropdown 1 selection, and submit the form based on both of two dropdown's selected values.
I know how to do the submit part, but I'm a bit lost on the dynamic rendering for dropdowns. I can let dropdown 1 to call a controller method to update db (used by dropdown 2) and redirect to the form. This doesn't seem to perform well. Any suggestions on how to write the two dropdowns?

Related

rails_admin change dropdown enum with javascript

I've override rails_admin edit and new form and controller via routes,
and added a javascript to watch for on change of country dropdown,
and refreshed the state dropdown.
but i couldn't find a way to replace the dropdown for state or manipulate the list.
does anyone know what script is rails_admin using for drop down?
I've tried to manipulate the select dropdown, but its been replaced and hidden by a script.

Sending javascript array with form data

i have 2 <g:select> elements in my gsp and both allow multiple selection (listboxes). I wrote some javascript that adds the option clicked by the user to the other select.
I build an array of items in select2.
I also have a form, that consist of checkboxes and such and submit button.
My problem is that I need to send that javascript array along other form data ( when i press submit ), to the controller. I just can't figure out a way, to send it.
Select box will get serialized and send with other form components, if you set every option to "selected = true".

Formtastic with multiple ajax calls

I'm trying to figure out the rails way to use formtastic to build out a couple of dropdown boxes and then based on those values make some ajax calls. For example:
At the top level my model is a PostOffice with a location_id
User selects dropdown #1 which is a list of states.
When dropdown #1 is changed dropdown #2 is populated with cities via an ajax call
When dropdown #2 is changed dropdown #3 is populated with addresses via an ajax call
User clicks 'get info' and the form submit happens.
Do I need to build out multiple semantic_form_for calls in my view to populate subsequent dropdown boxes? I can get this to work using a bunch of jquery but it's resulting in some unmaintainable code. Seems like I need to have it setup so that when I change dropdown #1 I need to make a request that generates a partial for dropdown #2.

How can I update a hidden form field on AJAX submit in Rails 3?

Questions on Rails 3.0.7, and JQuery 1.5.1
Overview
I'm trying to do the following thing. I have a web page with a form on one side that lets me create a category, and a list of items on the other side, with a checkbox for each item. I would like to be able to check the check box, for each item, so that when I submit the form to create the category, the newly created category also creates a has_many through association with each item.
So the association part works almost, I can submit a list of checked checkboxes, and Rails creates the association on the backend if I send the list of checked items.
Problem:
Here's what doesn't work:
I am trying to submit the form via Ajax, so I wanted to bind an event handle to the rails.js 'ajax:beforeSend' event, so that it would scan through my list of checked checkboxes and at the checked ids to a hidden form field.
The problem is: I try to get a list of all the checked boxes, and add them to the hidden field when the user clicks the Submit button. Therefore, I figured I'd place the code to do so in the ajax:beforeSend event handler. What I "THINK" I'm noticing however, is that rails.js has somehow already processed the form fields, and constructed the HTTP query before this handler fires. I notice this through the following behavior:
Observed Behavior
1) I can reload a fresh page, click the button to submit the form, the alert boxes from my handler pop up saying that no boxes are checked, and the created category in my db has no associated items (CORRECT BEHAVIOR)
2) I then click 1 checkbox, the alert boxes pop up showing which boxes are checked (CORRECT). But then when I submit thee form, the category in the DB still has no associate items. And I can see through firebug and the server logs that and HTTP query was sent containing the old parameter list, not the newer one. (WRONG)
3) I then submit the same form again, changing nothing, and it shows me the correct number of items.
So I get the impression that the parameter construction is lagging. I hope this wasn't too long, an someone can help me figure out what is going on.
My Question:
What event do I need to bind to, so that the form gets submitted with the correct parameters? Or is there another way to go about it completely?
Thanks
Here's my code below.
Thanks,
$('#my_form')
/* Now we need to configure the checkboxes to create an association between
* the items, and the interaction that is being created. First we will bind a
* function to the click event, and if the box is then checked, we will add
* the item id to the list of interaction items. If it is unchecked, we will
* remove the item from the list of interaction items.
*/
.live('ajax:beforeSend', function(event){
// First get a list of all the checked Items
var checked_items = new Array();
$('#items input[type="checkbox"]:checked').each(function(){
checked_items.push(this.getAttribute('data-item-id'));
});
// Then add this list of items to the new_interaction form to be submitted
$('#interaction_new_items').val(checked_items);
alert(checked_items);
alert($('#interaction_new_items').val());
})
Bind to the click event on the submit button itself. The click event will be processed before your ajax beforeSend event.
$('#my_form .submit').click(function() {
// rest of your code here
});
A more flexible solution (say, in case you wanted to submit the form with something other than a click) would be to bind to the form's submit event.
$('#my_form').submit(function() {
// Tweak your form data here
})

How to get multiple and individual update actions on product lines in mvc?

I've got a list of products in an admin section of my website. I have the product title and then an icon for delete and an icon for set visible/set invisible. I have both icons wrapped in their own form elements so they fire seperate Actions. I now one to add some checkboxes to each line so I can do a bulk delete. Following this:
How to handle checkboxes in ASP.NET MVC forms?
I'd need to wrap the whole list in a form tag to return the checkbox values, but then I have the icons on each row wrapped in form tags. I'm not sure what to do or how to handle this so it all works. How can I maintain the line form tags but still get bulk update functionality?
It's probably going to require some JavaScript. I would create a form outside of the table with a hidden element. When a box is checked, update the hidden element to contain a comma-separated list of all the IDs for rows that have the checkboxes checked (this would be pretty straightforward with jQuery). When that form is submitted, parse the values of the hidden element and delete accordingly.
Another option is to wrap the whole thing in one form and make the names of the delete buttons unique, then check for that when the form is submitted. When doing a bulk delete, you'll have all the checkbox values submitted like normal and you'll know it's a bulk delete based on which button they pressed to submit the form.

Resources