Question

I have a large Ruby on Rails form that has the following partial view structure (file _form.html.erb)

<script language="javascript" type="text/javascript">

    function myFunction1() {

        ... some js code here

    }

    function applyConfigs() {

        ... some js code here

    }

</script>

<%= form_for(@test, :html => {:name => "Test", :id => "test_form"}) do |f| %>

    ... some Ruby code here

    <div class="actions">
        <input type=button value="Run Function1" onclick="myFunction1();">
    </div>

    ... some Ruby code here

    <div class="actions">
        <input type=submit value="Apply" onclick="applyConfigs();">
    </div>

<% end %>

In this situation, none of the functions gets called when I click “Run Function1” or “Apply” buttons (the buttons highlight but do nothing). But if I put each function in a separate

<script>
</script>

therefore having 2 script /script sections containing one function each, then function myFunction1() gets executed properly but applyConfigs() still does not (the form is submitted but applyConfigs() function is not executed). There are no error messages in any case, just the functions not executed.

Any idea what’s going on here?

My function applyConfigs() is quite large but here’s my other function that I called myFunction1()

function showHideDiv(elementId,buttonId) {
    if (document.getElementById) {
        var element = document.getElementById(elementId);
        var button = document.getElementById(buttonId);
        if (element.style.display == 'none') {
            element.style.display = 'block';
            button.value = "Hide Options";
            return false;
        } else if (element.style.display == 'block') {
            element.style.display = 'none';
            button.value = "Show Options";
            return false;
        }
    }
}

Answer 1

The input type submit will submit the form. You need to change it:

<div class="actions">
 <input type="button" value="Apply" onclick="applyConfigs();">
</div>