Search code examples
jqueryruby-on-railsruby-on-rails-3jeditable

all fields editable at same time using jeditable


I am working with jeditable in Ruby on Rails.

I’m trying to do is click a button and all the fields a certain row become editable and automatically go to their editable state. Is this possible?

This is my java script

<script>
jQuery(document).ready(function($) {
    $(".edit_textfield").each( function() {  
          $(this).editable('<%= @student.id%>', {
                indicator   :'Saving...',
                tooltip     :'Click to edit...',
                rows        :10,
                method      :"PUT",
                submitdata: {id: $(this).attr('id'),name: $(this).attr('name')}
            });
    });
});
</script>

This is the show page

<p>
  <b><%=t :Name%>:</b>
  <dd class="edit_textfield" id="<%= @student.id %>" name="name"><%= @student.name %></dd>
</p>

<p>
  <b><%=t :Age%>:</b>
  <dd class="edit_textfield" id="<%= @student.id %>" name="age"><%= @student.age %></dd>
</p>

<p>
  <b><%=t :Address%>:</b>
  <dd class="edit_textfield" id="<%= @student.id %>" name="address"><%= @student.address %></dd>
</p>

<p>
  <b><%=t :Phone%>:</b>
  <dd class="edit_textfield" id="<%= @student.id %>" name="phone"><%= @student.phone %></dd>
</p>

I want to setup a button like

<button type="button" id="button1">Click this button and all the fields will become editable!</button>

so that by clicking this i want to make all fields editable


Solution

  • java script

    $(".edit_trigger").bind("click", function() {
        $(".edit_textfield").click();
    });
    

    Button

    <button type="button" class="edit_trigger">Click this button and all the fields will become editable!</button>