Databases
StackOverflow2013
Postsdbo
POadapting Coffeescript for a rails application
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POadapting Coffeescript for a rails application
    primarykey
    data
    text
    <p>I have an application where the user adds a <code>student_group</code> in which they declare how many <code>students</code> are in this group. I'm trying to adapt the js from this <a href="https://stackoverflow.com/questions/15130587/jquery-add-or-remove-table-row-based-on-inputs">thread</a> (which i changed to coffeescript via js2coffee.org) to work with my application, but i've never learned or used js before so I'm having some trouble. Thanks for any help!</p> <p><code>student_groups.js.coffee</code></p> <pre><code># Place all the behaviors and hooks related to the matching controller here. # All this logic will automatically be available in application.js. # You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/ # # https://stackoverflow.com/questions/15130587/jquery-add-or-remove-table-row-based-on-inputs emptyRow = -&gt; row_i++ @obj = $("&lt;tr&gt;&lt;/tr&gt;") @obj.append "&lt;td&gt;&lt;input type=\"text\" size=\"5\" value=\"" + row_i + "\"/&gt;&lt;/td&gt;" @obj.append "&lt;td&gt;&lt;input type=\"text\" size=\"5\" name=\"mm" + row_i + "\" id=\"id_mm" + row_i + "\"\"/&gt;&lt;/td&gt;" @obj.append "&lt;td&gt;&lt;input type=\"text\" size=\"5\" name=\"dd" + row_i + "\" id=\"id_dd" + row_i + "\"\"/&gt;&lt;/td&gt;" @obj.append "&lt;td&gt;&lt;input type=\"text\" size=\"5\" name=\"ma" + row_i + "\" id=\"id_ma" + row_i + "\"\"/&gt;&lt;/td&gt;" @obj.append "&lt;td&gt;&lt;input type=\"text\" size=\"5\" name=\"sr" + row_i + "\" id=\"id_sr" + row_i + "\" value=\"0\"\"/&gt;&lt;/td&gt;" # how many applications we have drawed now ? refresh = (new_count) -&gt; if new_count &gt; 0 $("#nos_header").show() else $("#nos_header").hide() old_count = parseInt($("tbody").children().length) # the difference, we need to add or remove ? rows_difference = parseInt(new_count) - old_count # if we have rows to add if rows_difference &gt; 0 i = 0 while i &lt; rows_difference $("tbody").append (new emptyRow()).obj i++ else if rows_difference &lt; 0 # we need to remove rows .. index_start = old_count + rows_difference + 1 $("tr:gt(" + index_start + ")").remove() row_i += rows_difference row_i = 0 $(document).ready -&gt; $("#nos").change -&gt; refresh $(this).val() </code></pre> <p><code>student_groups/new</code></p> <pre><code>&lt;%= form_for(@student_group) do |f| %&gt; &lt;p&gt; &lt;%= f.label :name, "Enter a nickname for this group" %&gt; &lt;%= f.text_field :name, placeholder: "..." %&gt; &lt;/p&gt; &lt;p&gt; &lt;%= f.label :number_of_students, "How many students are in this group?" %&gt; &lt;!-- https://stackoverflow.com/questions/10038993/rails-and-forms-drop-down-with-range-of-numbers-and-unlimited --&gt; &lt;%= f.select :number_of_students, (0..60), :id =&gt; "nos" %&gt; &lt;/p&gt; &lt;table class="student_input_form"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;&lt;%= f.label :name, "What is the student's name?" %&gt;&lt;/td&gt; &lt;td&gt;&lt;%= f.label :gender, "What is the student's gender?" %&gt;&lt;/td&gt; &lt;/tr&gt; &lt;%= f.fields_for :students do |builder| %&gt; &lt;%= render 'students/form', :f =&gt; builder %&gt; &lt;% end %&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;%= f.submit "Submit", :class =&gt; 'big_button round unselectable' %&gt; &lt;% end %&gt; </code></pre> <p>and lastly, `students/_form'</p> <pre><code>&lt;tr id="nos_header" style="display:none"&gt; &lt;td&gt;&lt;%= f.text_field :name, placeholder: "..." %&gt;&lt;/td&gt; &lt;td&gt;&lt;%= f.select :gender, ['Female', 'Male', 'Transgender'] %&gt;&lt;/td&gt; &lt;/tr&gt; </code></pre> <p><strong>EDIT</strong>: @mu, to address your comment: (1) have fixed the formatting, although the input box and the output bear little to no relation to each other. I've read the documentation on formatting text/code on SO, but something's still not clicked, clearly. apologies. (2) took out that open <code>&lt;p&gt;</code> tag - think that must have been a leftover from before a change. thanks for pointing it out. (3) as for what doesn't work - I should have been more clear. I'm aiming for functionality similar to <a href="http://jsfiddle.net/amullins/5LkUQ/3/" rel="nofollow noreferrer">this</a> on the page I linked to originally. When the user puts in the number of students, the coffeescript should kick in and show the appropriate number of fields for that many new students to be input. However, at the moment, that's not happening. I'm not getting any errors in the browser (ie, everything <em>else</em> works) - but when I select the number of students, nothing changes on the page. Thanks for your help!</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USdax
    plurals
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    3. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. CO(1) Clean up your formatting and indentation so that your code is readable. (2) You can't put a `<table>` inside a `<p>` so there's an implicit `</p>` right before your `<table class="student_input_form">` that you might want to make explicit. (3) What is the question? Does something not work? What does "not work" mean in this context?
      singulars
      1. POadapting Coffeescript for a rails application
      1. USmu is too short
    2. CO@muistooshort, see edit.
      singulars
      1. POadapting Coffeescript for a rails application
      1. USdax
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload